I am running into a problem where the when passing states from the App.jsx to the View as seen below:
<View
key="loading"
loadingTest={this.state.loadingTest}
main
className="safe-areas"
url='/loading_page/' />
As seen above i am passing LoadingTest to View and its base page the loading_page. The issue rises when the value in the parent (ie. app.jsx) is updated it triggers the componentDidUpdate in the child class as shown below:
constructor(props) {
super(props);
console.log(props.f7router.params.loadingTest);
this.state = {
loadingTest: props.f7router.params.loadingTest
}
}
componentDidUpdate(prevProps) {
console.log(prevProps.f7router.params.loadingTest, this.props.f7router.params.loadingTest);
if (prevProps.f7router.params.loadingTest!== this.props.f7router.params.loadingTest) {
this.setState({ loadingTest: this.props.f7router.params.loadingTest});
}
}
The function is called but both the previous and new props both have the same values and nothing has changed why is that the case and why is it being triggered if the updated value is not changing?
Any help would be much appreciated,
Thank you,