ajax 요청시 데이터를 가져오지 못합니다.

[이성훈]

/*eslint-disable*/
import './App.css';
import { Navbar, Container, Nav, Col, Row } from 'react-bootstrap'
import bg from './img/bg.png'
import { useState } from 'react';
import data from './data.js'
import { Routes, Route, Link, useNavigate, Outlet } from 'react-router-dom'
import Detail from './Pages/detail.js'
import axios from 'axios'

function App() {

let [shoes] = useState(data)
let navigate = useNavigate()

return (
<div className="App">

<Navbar bg="dark" variant="dark">
<Container>
<Navbar.Brand onClick={() => { navigate('/') }}>shoesShop</Navbar.Brand>
<Nav className="me-auto">
<Nav.Link onClick={() => { navigate('/detail') }}>detail</Nav.Link>
<Nav.Link onClick={() => { navigate('/about') }}>about</Nav.Link>
</Nav>
</Container>
</Navbar>

{/* <Link to="/">홈</Link>
 <Link to="/detail">상세페이지</Link>
 <Link to="/about">어바웃페이지</Link> */}

<Routes>
<Route path="/" element={
<>
<div className='main-bg' style={{ backgroundImage: 'url(' + bg + ')' }}></div>
<button onClick={() => {
axios.get('https://codingapple1.github.io/shop/data2.json')
 .then((data) => { data })
console.log(data)
 }}>버튼</button>
<div>
<Container>
<Row>
{shoes.map((a, i) => {
return (
<Card shoes={shoes[i]} i={i + 1} />
 )
 })
}
</Row>
</Container>
</div>
</>
} />
<Route path='/detail/:id' element={<Detail shoes={shoes} />} />
<Route path='/about' element={<About />}>
<Route path='member' element={<div>멤버페이지</div>} />
<Route path='location' element={<div>로케이션페이지</div>} />
</Route>
<Route path='/event' element={<Event />}>
<Route path='one' element={<div>첫 주문시 양말 증정</div>} />
<Route path='two' element={<div>생일 기념 쿠폰받기</div>} />
</Route>
<Route path='*' element={<div>없는페이지입니다</div>} />
</Routes>

</div>
 );
}

function About() {
return (
<div>
<h4>회사정보</h4>
<Outlet></Outlet>
</div>
 )
}

function Event() {
return (
<div>
<h4>오늘의 이벤트</h4>
<Outlet></Outlet>
</div>
 )
}

function Card(props) {
return (
<Col sm>

<h4>{props.shoes.title}</h4>
<p>{props.shoes.price}</p>
</Col>
 )
}

export default App;

console.log 출력시 기존의 데이터가 출력이 되는데 어떤 문제로 ajax 데이터가 출력되지 않는지 
궁금합니다.

[codingapple]

console.log를 .then 안에 넣으면 됩니다

[글쓴이]

글