使用反应表并做出反应选择

时间:2017-09-13 11:29:00

标签: javascript reactjs react-select

我使用react-table创建了一个表。在最后一栏中,我有标签,我使用自定义过滤器。我使用反应选择库进行自动完成搜索和多选选项。

  {
Header: ' categoury',
accessor: 'tags',
Cell: cells.Tags,
Filter: ({ filter, onChange }) => (
  <Select
    options={filter}
    labelKey="name"
    valueKey="key"
    clearable={false}
    multi={true}
    value={filter}
    onChange={value => onChange(value)}
  />
),

}, 现在我不知道如何处理onChange方法。我希望当用户开始输入时,请求发送的服务器和选项(标签)加载到选择。 我在另一栏中做到了这一点:

  <ReactTable
    manual
    filterable
    onFetchData={this.onFetchData}
    columns={columns}
    noDataText="No Data!"
    {...this.state}
  />

onFetchData:

  onFetchData = async state => {
    const query = rest.getQueryFromTableState(state);
    this.setState({ loading: true });
    const data = await this.fetchFrom({ model: 'item', query });
    this.setState({
      data: data.map(R.merge({ isSelected: false })),
      loading: false,
    });
  };
  fetchFrom = ({ model, query }) =>
    rest.get(
      `/v1/distributor/${model}?${query}`,
      null,
      rest.getDistKeyFromProps(this.props),
    );

0 个答案:

没有答案