[React] 종속성배열 []

  useEffect(() => {
    setFormIsValid(
        enteredEmail.includes('@') && enteredPassword.trim().length > 6
    );
  },[]);
  ...
  
   <Button type="submit" className={classes.btn} disabled={!formIsValid}>

이렇게 있는 경우 [] 종속성 배열때문에 앱이 시작될 때 한번만 실행된다. 

종속성 변경이 되는 경우에 use Effect를 실행한다.

 

종속성배열때문에 로그인 버튼이

아래와 같이 활성화 되지 않는데

종속성 배열을 제거해주면 위와 같이 다시 누를 수 있게 변경이 된다. 

 

  useEffect(() => {
    setFormIsValid(
        enteredEmail.includes('@') && enteredPassword.trim().length > 6
    );
  },[enteredEmail, enteredPassword]);

아니면 위와 같이 setFormIsValid를 제외한 enteredEmail, dnterdPassword만 종속성배열에 넣어주면 다시 

Login버튼이 활성화 된다.