如何解决覆盖 React 材料表中的搜索功能
我想覆盖材料表的搜索功能,但我很困惑,因为我不知道我将使用什么正确的道具? 数据 ?数据管理器?哪一个?
<MaterialTable
columns={columns}
data={certificates}
components = {{
Toolbar: props => (console.log(props),(<MTabletoolbar {...props}/>
))
}}
/>
我想改变,因为它在前端搜索,但我有一个搜索功能,我想使用它。
解决方法
// Create a state
constructor() {
super();
this.state = {
searchQuery: [],tableQuery: '',}
this.tableRef = React.createRef();
}
/**
* Function to fetch all Data based on search query
* Keep in mind **query** is the default parameter for tableData element. Which returns an array with required search * values.
*/
fetchData(clientId,query) {
query.search = this.state.searchQuery;
this.setState({ tableQuery: query });
return authenticationService.getAllNotifications(clientId,query)
.then((result) => {
const tableData = {
data: result.data.data.records,page: result.config.params.page - 1,totalCount: result.data.data.count,};
return tableData;
});
}
<Table tableData={query => this.fetchData(authenticationService.currentData.source._value.clientId,query)}
columns={this.state.columns}
myRef={(ref) => { this.tableRef = ref; return true; }}
options={{
actionsColumnIndex: -1,pageSize: 10,showTitle: false,isLoading: true,debounceInterval: 500,search: true
}}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。