비동기식 처리를 동기식으로 바꾸고싶습니다 setTimeout()
function Test() {
let [axiosData, setAxiosData] = useState([
{ id: 0, title: "good shoes",
content: "goodthan 6",
price: 220000
}
]);
return (
<>
<button
onClick={() => {
axios.get("https://codingapple1.github.io/shop/data2.json")
.then((res) => {
setTimeout(() => {
setAxiosData(res.data);
}, 1000);
console.log(axiosData);
});
}}
>
버튼
</button>
</>
);
}
axios 요청한 Promise 상태 데이터를 .then() 을사용했습니다.
.then()메서드를이용해서 response data [{...},{...}{...}]
3개의 자료를 setTimeout() state변경함수를 통해
state 값을 바꾸려하고있습니다 (state변경함수는 비동기식처리
라서 값이 바뀌기전에 콘솔이 먼저실행되어 변경되기전값이
찍히는데 여기서 async & await을 이용하지않고
setTimeout() 함수가 실행이된후에 콘솔이 찍히도록
순차적인 실행을 하기위해선 어떻게하는게 좋을까요?
useEffect 나 async & awiat 를 이요하지않고 는방법이없는건가요?
setAxiosData(res.data); 늦게처리하는 state변경함수를 꼭 사용후에 콘솔이 작동하게
해보고싶습니다 . . . .ㅠㅠ