4

Main component:

const AProfileFilter = ({ data = []) => {
    const [getData, setData] = useState([]);
    const [getStore, setStore] = useState([]);
    
    useEffect(() => {
        setData(prepareFilterData(data));
    }, [data]);

    useEffect(() => {
        setStore({ "addMoreOptions": getData.filter((flr) => flr.isShow === false), "displayFields": getData.filter((flr) => flr.isShow === true) })
    }, [getData]);
  
    // AProfileFilter logic here
    // (getStore) addMoreOptions state will be update based on some condition.

    return <ASelect defaultValues={getStore.addMoreOptions}>
}
export default ZListingProfileFilter;

Sub Component:

const ASelect = (props) => {
    // ASelect logic here
}
function areEqual(prevProps, nextProps) {
  console.log("prevProps > ",prevProps.defaultValues, "nextProps > ",nextProps.defaultValues);
  return _.isEqual(prevProps.defaultValues, nextProps.defaultValues);
}
export default memo(ASelect, areEqual);

Current Result:

enter image description here

Expected Result:

  1. Initially it fine to have (Blank Array) [] and then update it to (Filled Array) [{...}]
  2. Second time I want previous should be (Filled Array) [{...}] and update one should be (Blank Array) [], because I have made it as blank from AProfileFilter component.
Jayesh Naghera
  • 319
  • 3
  • 13

0 Answers0