[React] UseEffect에서 비동기 처리

발생원인 : UseEffect자체를 비동기처리 불가

 

해결방법 {

• 비동기 처리에 대한 학습

발생로직(선언부분)

 

함수형 컴포넌트

  useEffect(()=>{
    initWeb3()
    pollData()
  },[]);

 

• async initWeb3 함수에서 백로직인 Solidity와 연동하는 작업
• 연동로직 처리 전 pollData 호출하여 undefined

클래스형 컴포넌트

  async componentDidMount(){
    await initWeb3()
    await pollData()
  
  }

• 함수형 컴포넌트와 다르게 componentDidMount 자체를 비동기 처리 가능

 

---

TroubleShooting

• useEffect 내부에서 비동기 처리 함수를 선언하여 호출

  useEffect(()=>{

     const test = async()=>{
       await initWeb3()
       await pollData()
     }
     test();

    
  },[]);

---

해결방법 

• UseEffect 내부에서 비동기 처리 로직을 따로 생성.
• UseEffect 내부에서 initWeb3이 호출 완료 후에 pollData 호출
•  

   useEffect(()=>{
	initWeb3().then(()=>polldata())

    
  },[]);