SearchBar Component does not auto populate the search bar based on the query from the URL. However, it shows the query in the search bar if the page is refreshed, the reason being that the AutoCompleteInput component (used for the SearchBar input) doesn't update when it receives new props.
A simple solution would be to add componentWillReceiveProps life cycle method to AutoCompleteInput Component, so it updates the state variable - value (used to store the search bar input) every time the SearchBar gets a new query from the url. Below is the life cycle method:
componentWillReceiveProps(nextProps) {
if (nextProps.value !== this.props.value) {
this.setState({ queryValue: nextProps.value });
}
}
SearchBar Component does not auto populate the search bar based on the query from the URL. However, it shows the query in the search bar if the page is refreshed, the reason being that the AutoCompleteInput component (used for the SearchBar input) doesn't update when it receives new props.
A simple solution would be to add componentWillReceiveProps life cycle method to AutoCompleteInput Component, so it updates the state variable - value (used to store the search bar input) every time the SearchBar gets a new query from the url. Below is the life cycle method: