score:8
Accepted answer
the solution is pretty-simple. All you need to do is make use of componentWillReceiveProps
and check if the param updated, if it did fetch the data again
componentDidMount() {
this.getData(this.props.match.params.id);
}
componentWillReceiveProps(nextProps) {
if(this.props.match.params.id !== nextProps.match.params.id) {
this.getData(nextProps.match.params.id);
}
}
getData = (param) => {
fetch(`http://localhost:1337/${params}`)
.then((res) => res.json())
.then((json) => {
this.setState({
data: json,
});
});
}
Source: stackoverflow.com
Related Query
- React Router Dom & Firebase Auth: history.push changes url but does not render new component when called after firebase auth create account
- React router Dom Link does not change URL
- React router does not change view, but url is changed - App is load inside iframe
- React-router-dom - Link change url but does not render
- Reactjs - changing url using react router but the component does not change
- React Link changes URL but does not render page
- React Router v5: history.push() changes the address bar, but does not change the page
- React router dom redirect problem. Changes url, does not render component
- React Router useHistory. History.push changes url but does not load component
- React URL changes but component does not render
- React router goes to proper URL but does not update the view
- Link to changes state but does not change URL
- React router dom changes url, does not render component
- React router does not render route when URL accessed directly
- React reach router link tag updates url but not the component
- React Router Link changes URL but doesn't render Component - Rest Countries API
- react router dom is not updating class component when url change
- React router dom v5 history.push does not render new page
- history.push changes url but does not render form react hooks
- URL changes but component is not render - React Router
- Why does React Router not render the previous link again in a nested setup?
- React router Link is changing the url but not actually redirecting
- React router 4 - Why is my component only rendered on manually setting the url but not on clicking a Link with same url?
- react router dom, replaces the browser url but does not go to the page
- React Router Dom - React Router changing url but not page
- React Router url updates but component does not
- React Router DOM - Redirect component does not render route properly
- React Router changes route but does not render the component
- Multiple params with React Router change url but not component
- Why Link from React Router Dom does not refresh when go back?
More Query from same tag
- Updating parent state from child components not working in reactjs
- How can I detect refresh page and routes change in react?
- React 'props' is not defined
- unable to set defaultValue in redux-form-material-ui TextField
- Unable to import sass files in react
- How to access a JSON static file imported with Webpack?
- React, TypeScript Hero and TSLint question
- React throw error while using ReactRouter useLocation
- Redux form and isomorphic-fetch always submits blank form to server
- How to handle impure functions in useReducer()
- html table is duplicating defaultValue's for no apparent reason
- Problem fetching data from inner join table with axios in react
- type 'yyy' is missing the following properties from type 'elementclass': context, setstate, forceupdate, props, and 2 more. ts2605
- How to align buttons in reactstrap?
- Firebase - Losing Auth Session After An Hour
- Limit selection of checkboxes react
- Nested React Router
- I'm having trouble with NextJs useRouter
- Modify CSS on React-Slick
- ReactDOM Hello World
- How to trigger hot reloading for React when a package in node_modules is changed?
- React: Getting an object on click
- How to change header logo in specific page in ReactJS
- Dynamic menu tabs in ReactJS
- Writing React Component with multiple checkbox
- import react(lowercase) vs import React(Uppercase)
- Create a dropdown animation in react
- How we can make this circle background color disappearing animation CSS
- Format DD/MM/YYYY in reactjs on Input Change
- DevExtreme React Grid