itsource

반응 후크 - 개체 집합에서 중첩된 속성이 변경되면 useEffect를 트리거합니다.

mycopycode 2023. 2. 10. 21:53
반응형

반응 후크 - 개체 집합에서 중첩된 속성이 변경되면 useEffect를 트리거합니다.

페이지에 개체 목록이 표시됩니다.[{name:, age:}, ...]두 번째 페이지에서 특정 개체의 이름을 업데이트할 수 있습니다.그러면 후크를 사용하여 어떻게 구현해야 합니까?useEffect()이름 변경이 감지되었을 때만 1면 목록이 업데이트되는 건가요?

const [objects, setObjects] = useState([]);

useEffect(()=> {
  getAllObjects()
},[getAllObjects, objects]);

전체 개체를 종속 배열에 전달하는 대신 이름만 전달해야 합니다.이름을 돌려서 할 수 있는 일

const [objects, setObjects] = useState([])

useEffect(()=> {
      getAllObjects()
}, [getAllObjects, ...objects.map(item => item.name)])

https://dev.to/aileenr/til-you-can-watch-for-nested-properties-changing-in-react-s-useeffect-hook-26nj 를 확인해 주세요.

할 수 있는 일은 다음과 같습니다.

useEffect(()=> {
      // do something
}, [values.name])

오브젝트 속성이 항상 존재하는 경우에는 적절한 해결책이지만 속성이 존재하지 않는 경우에는 참조 오류가 발생합니다.이 시나리오의 회피책은 후크 내부에 프로펠러가 있는지 확인하는 것입니다.

useEffect(()=> {
    if (values?.name) {
        // do something
    }
}, [values])

지금까지의 답변 중 어느 것도 통하지 않았다

제 솔루션은 다음과 같습니다.

const [objects, setObjects] = useState([]);

useEffect(()=> {
  getAllObjects()
},[getAllObjects, ...Object.values(objects)]);

이렇게 하면 상태에서 값을 추출할 수 있으며 이러한 값 중 하나가 변경되면 useEffect가 트리거됩니다.

중첩된 개체에 JSON.stringify를 추가하십시오.

useEffect(()=> {
   getAllObjects()
},[getAllObjects, JSON.stringify(objects)]);

언급URL : https://stackoverflow.com/questions/56010536/react-hooks-trigger-useeffect-when-a-nested-property-changes-in-a-collection-o

반응형