I have this user search function that adds a parameter to the router and calls the API. It only sends a single param, username. But now I want to send firstName, lastName and email removing username in the search function. I have a backend API with this structure:
var searchResult = repo.Search(
username: query.username,
firstName: query.firstName,
lastName: query.lastName,
email: query.email);
The way I am calling username now is with something like this:
onSearch = () => {
if (this.state.searchValue) {
this.context.queryUpdater.addParam('username', this.state.searchValue);
} else {
this.context.queryUpdater.removeParam('username');
}
};
addParam and removeParam removes the params from the router and URL. I have tried adding three params like below, but it did not work the way it was supposed to, it calls all the field but does not works, it updates the router to /users?firstName=first&lastName=first&email=first but only shows the results for firstName
if (this.state.searchValue) {
this.context.queryUpdater.addParam('firstName', this.state.searchValue);
this.context.queryUpdater.addParam('lastName', this.state.searchValue);
this.context.queryUpdater.addParam('email', this.state.searchValue);
} else {
this.context.queryUpdater.removeParam('firstName');
this.context.queryUpdater.removeParam('lastName');
this.context.queryUpdater.removeParam('email');
}
And the search input is broken too,
updateFilterState = options => {
this.setState({
searchValue: options.firstName || options.lastName || options.email || '',
});
};
It was only options.username so I added those three. But now, every time I hit backspace and clear the field it displays the same value with removing the last character, for example : hello and I clear the field hell comes back.
I hope this can help you understand a little, or still maybe difficult to understand the whole issue but any help would be appreciated. Thanks.