0

I am using the React useEffect hook along with Redux. My action creator runs for the first time following the first render, as i specify the [] as the second argument of useEffect. The action involves reaching out to an API to get some data back.

The redux state object storeItems then updates and everything is fine. However, I am getting the eslint warning React Hook useEffect has a missing dependency: 'props'.. I don't want to specify the second argument as [props] as this will cause a second run of useEffect, which means a needless reach out to an API. Does anyone have a way to get rid of this warning without specifying the second argument as [props]?

function GetStoreData(props){
    useEffect(() => {
        props.getStoreItems()
        console.log(props.storeItems)
    }, []);

    return null
};

const mapStateToProps = (state) => {
    return {storeItems: state.storeItems};
};

export default connect(mapStateToProps, {getStoreItems: getStoreItems})(GetStoreData);
macborowy
  • 1,474
  • 10
  • 13
Sean
  • 587
  • 4
  • 20
  • https://stackoverflow.com/questions/55840294/how-to-fix-missing-dependency-warning-when-using-useeffect-react-hook – Pavlos Karalis Jul 24 '20 at 22:44
  • Does this answer your question? [Want to set state once on first render without causing uneccessary re-renders on further updates](https://stackoverflow.com/questions/62057343/want-to-set-state-once-on-first-render-without-causing-uneccessary-re-renders-on) – Drew Reese Jul 24 '20 at 23:43

0 Answers0