Поле пользовательского поиска для React Datatables - PullRequest
0 голосов
/ 13 июня 2019

У меня есть набор данных, как показано по умолчанию здесь . Я хочу, чтобы панель поиска отфильтровывала данные, отделенные от того места, где они есть, и чтобы они находились где-то совершенно иначе. Поэтому я хочу, чтобы мое собственное поле ввода использовалось для поиска данных точно так, как это делает текущее значение по умолчанию.

Вот мой код и мой текущий прогресс ...

state = {
    searchValue: ''
}

const data = [
    ["Gabby", "Data 1", "Pending", "15/01/19", "$100,000"],
    ..........];

let options = {
    .....
    customSearch: (searchQuery, currentRow, columns) => {
        let isFound = false;
        currentRow.forEach(col => {
            if (col.toString().indexOf(this.state.searchValue) >= 0) {
                isFound = true;
            }
        });
    return isFound;
    }
};
.....
<input
    type="text"
    value={this.state.searchValue}
    onChange={(e, value) => this.handleSearchChange(e, value)}
/>
......
<MUIDataTable
    title={"My Title"}
    data={data}
    columns={columns}
    options={options}
/>

То, что в данный момент делает, вы можете ввести в мое поле ввода, но вам нужно открыть поле поиска по умолчанию, и при вводе там будет использоваться мой текст поиска. Таким образом, у меня есть поиск с использованием пользовательского поиска. Я хотел бы, чтобы он работал так же, как в GIF .

Извините, если это нуб, но я долго не работал с React.

Спасибо

1 Ответ

0 голосов
/ 13 июня 2019

Я был так близко.Мне просто нужно было добавить searchText: this.state.searchValue, выше customSearch и изменить if (col.toString().indexOf(this.state.searchValue) >= 0) { на if (col.toString().indexOf(searchQuery) >= 0) {.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...