**reactClass.js**
<hookFunction tableData={[]} />
How can i update tableData from hookfunction below from its external function. I expect update to happen onChange effect.
**hookFunction.js**
import React from 'react';
function TableR({ data }) {
return (
<input
value={filterValue || ''}
onChange={(e) => {
// update props `tableData`
}}
/>
);
}
function App({tableData}) {
return (
return <Table data={tableData} />;
);
}
export default App;
You can use the hook useState
with useEffect
to listen for prop updates:
function TableR({ data, setTableData }) {
return (
<input
value={filterValue || ''}
onChange={(e) => {
setTableData(e.target.value);
}}
/>
);
}
function App({tableData}) {
const [data, setTableData] = useState(tableData);
useEffect(() => {
// this will update the state if tableData coming as props changes
setTableData(tableData);
}, [tableData]);
return <Table data={data} setTableData={setTableData} />;
}
Hope this helps!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.