如何解决尽管传递了相关状态
每当用户按下“搜索”字段上的按钮但无法这样做时,我想添加一个加载程序或一个简单的文本,例如“正在搜索...”。代码如下:
fetchingDataOnChange = () => {
let nameValue = this.state.searchName;
var myParams = {
nameValue: nameValue
}
axios.post('/get-hcp-data',myParams)
.then((res) => {
const hcps = res.data;
this.setState({ isLoading: true })
console.log('State before loading data: ',this.state);
this.setState({ hcps: hcps,hcpName: Object.values(hcps.hcp_details_concat) })
console.log('HCP Data values on typeahead: ',Object.values(this.state.hcps.hcp_details_concat));
console.log(res);
this.setState({ isLoading: false })
console.log('State after loading data: ',this.state);
},(error) => {
console.log(error);
});
}
<Typeahead
id="basic-example"
options={this.state.hcpName}
placeholder="Search by Name..."
emptyLabel={this.state.isLoading ? "Searching..." : ''}
isLoading={this.state.isLoading}
onInputChange={(searchName) => this.setState({ searchName },this.fetchingDataOnChange)}
/>
如您所见,我还尝试了控制台日志记录,并且状态正在适当更改,但 emptyLabel 和 isLoading 功能都不起作用。有什么原因吗?
正在获取数据,但加载程序部分不起作用。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。