use효과 트리거링 안 함

use효과 트리거링 안 함

내 useEffect가 고장 난 것 같아.

부모 구성요소를 가지고 있다.

 <div className={redactKategori}>
    <select className="form-control form-control-sm mb-3 mr-2" name="betalt" defaultValue={'välj kategori'} onChange={e => { e.preventDefault(); setKate(e.target.value); setRedactKategoris('d-block') }}>
      <option >valj kategori</option>
      { Kategori ?
        Object.keys(Kategori).map(key => {
          return (
            <option key={key} value={key}>{key}</option>
          )
        }) :
        null
      }
      </select>
    <div className={redactKategoris}>
  <EditKat aa={kate} />
</div>

및 하위 구성 요소

function EditKat({ aa }) {
  let defaultValues = 0

  useEffect(() => {
    defaultValues = 2
  }, [aa])

  console.log(defaultValues)
}

그래서, 내가 아는 한, 매번${kate}부모 구성 요소에 대한 값을 얻고, 자식 구성 요소가useEffect그러나 그것은 작동하지 않는다.내가 뭘 잘못하고 있나요?

경험하는 행동의 이유는 그 때문이 아니다.useEffect효과가 없어기능 구성요소가 작동하는 방식 때문이다.

자녀 구성 요소를 살펴보면,useEffect실행 및 구성 요소 렌더링,defaultValues할 것이다0다시, 함수 내부의 코드는 각 렌더 주기마다 실행되기 때문이다.

그 문제를 해결하려면useState지역 상태를 임대업자 간에 일관적으로 유지하려면

이렇게 보일 겁니다.

function EditKat({ aa }) {
  // Data stored in useState is kept across render cycles
  let [defaultValues, setDefaultValues] = useState(0)

  useEffect(() => {
    setDefaultValues(2) // setDefaultValues will trigger a re-render
  }, [aa])

  console.log(defaultValues)
}

부모 코드에 구성 요소가 생성되면 해당 구성 요소에 키 프로펠러를 추가해 보십시오.

<yourcomponent key="uniquevalue" />

이는 대부분의 경우 구성 요소를 재사용할 때 생성 방식에 따라 재사용할 때 다시 재생성하는 대신 일부 변경사항으로 다시 렌더링할 수 있기 때문이다.useEffect호출되지 않을 것이다.예를 들어 스위치루트, 루프, 컨디션...

그래서 키를 추가하면 이런 일이 일어나지 않을 것이다.루프에 있는 경우 인덱스를 포함하여 각 요소가 고유한지 확인하십시오.i더 나은 고유 키를 찾을 수 없을 경우 키에 저장하십시오.

참조URL: https://stackoverflow.com/questions/60753235/useeffect-not-triggering