score:4
Accepted answer
the dependency array you pass to useeffect()
is empty, but you're using props. getinvoicedata()
inside of it, so it's missing the props
. add it like this:
useeffect(() => {
props.getinvoicedata();
}, [props]);
better would be to deconstruct your props:
const tablesection = ({invoicedata , getinvoicedata}) =>{
useeffect(() => {
getinvoicedata();
}, [getinvoicedata]);
// use invoicedata here
console.log(invoicedata);
dependencies are used to let useeffect()
know if it should fire again or not. since your getinvoicedata
is function, in this case it will only fire once, just like componentdidmount()
.
score:2
using react-redux hooks like useselector
and usedispatch
will minimize your work time, here your code with react-redux hooks:
import { getinvoicedata } from "../../actions/tables"
import {useselector ,usedispatch} from "react-redux"
const tablesection = (props) =>{
const {invoicedata} = useselector(state=>state.tables)
const dispatch = usedispatch()
useeffect(() => {
dispatch(getinvoicedata())
}, []);
const classes = usestyles();
return (<div>
{// here do something with invoicedata}
{invoicedata && invoicedata.map(...)}
</div>)
}
tablesection.proptypes = {
invoicedata: proptypes.object
};
export default tablesection;
Source: stackoverflow.com
Related Query
- React Hook useEffect has a missing dependency Props
- React Hook useEffect has a missing dependency: 'props'. Either include it or remove the dependency array. props in useEffect have no data
- React Hook useEffect has missing dependencies. Either include them or remove the dependency array
- React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array react-hooks/exhaustive-deps
- react hook useeffect has missing dependencies: yyy. either include them or remove the dependency array react-hooks/exhaustive-deps
- React | React Hook useEffect has a missing dependency
- React Hook useEffect has missing dependencies: 'colors' and 'options'. Either include them or remove the dependency array
- React Hook useEffect has a missing dependency when passing empty array as second argument
- React Hook useEffect has a missing dependency array
- React Hook useEffect has a missing dependency: 'formData'. Either include it or remove the dependency array. what is dependency is use
- React warning React Hook useEffect has a missing dependency when the deps are []
- React Hook useEffect has a missing dependency with useEffect
- warning: React Hook useEffect has a missing dependency
- React Hook useEffect has a missing dependency: 'fetchData'. Either include it or remove the dependency array
- React Hook useEffect has a missing dependency: 'handleLogout'. Either include it or remove the dependency array react
- React useEffect hook has a missing dependency warning
- React Hook useEffect has a missing dependency: 'loading'. Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency with Useeffect hook. Is it bad practice to ignore this warning?
- React Hook useEffect has a missing dependency. Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency
- React Hook useEffect has a missing dependency: 'evaluate'. Either include it or remove the dependency array
- React Hook useEffect has a missing dependency: 'location.state'. Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency: 'refreshDisplay'. Either include it or remove the dependency array
- React Hook useEffect has a missing dependency for redux action as parameters
- React Hook useEffect has a missing dependency: 'formValues'. Either include it or remove the dependency array react-hooks/exhaustive-deps
- ERROR: React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array
- React Hook useEffect has missing dependencies. Either include them or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has missing dependencies: 'dispatch' and 'logout'. Either include them or remove the dependency array
- React Hook useEffect has a missing dependency when updating state based on current value
More Query from same tag
- How to show only last 3 characters in paragraph?
- React with Adonis
- React Error : is declared but its value is never read. [6133]
- Component rerendering only after double click
- Creating reusable Button Component with React and Typescript with not assignable type error
- Jest: `npm test` not displaying "Watch Usage" options in Windows Git Bash
- Download a file programmatically while providing feedback to the user using Redux
- React Draft.js toolbar plugin not showing
- 100% height not working for Drawer, Material Design React
- CORS error even with cors nom package installed
- Return an object inside useEffect() and access it outside in React (after having assigned a state)
- How to pass redux store in Provider when using ReactDom.render() to the rendering element?
- Removing a String from an Array, but adding the Number amount back in Javascript
- Too many React Context providers
- React select Icon click
- React+mobx not render on initial page loading
- Why order of lines matters here?
- How to force typescript check destructured props?
- Reactjs does not render data in table
- .Net Core 3.1 & React (Redux-toolkit) Getting "Cannot GET /*" on hard refresh for react router
- implement the onSnapshot function for getting realtime updates in reactjs code
- How to change a class component (input, conditional) to functional component with useState - hook?
- react hooks: useState nested other useState, setState is not working?
- React Carousel memory leak issue (I cannot get first selected value from list)
- regex - Filter out year from a date string in an array of objects
- I want to save variable as String through Axios response
- Should I remove a reference to a DOM element when a component unmount in react?
- Disable this console messages that appears in event handlers at React
- Removing server-side injected CSS
- Is it safe to useMemo for JSX?