Минимизируйте параметры для createSelector при повторном выборе Reactjs

Я использую повторный выбор в своем коде ReactJs. Вот фрагмент кода. Из-за большого размера файла я опускаю из него ненужный код.

import { createSelector } from 'reselect';

const todoSelector = state => state.todo.todos;
const searchTermSelector = state => state.todo.searchTerm;
const searchViewSelector = state => state.todo.userView

export const filteredTodos = createSelector(
  [todoSelector, searchTermSelector, searchViewSelector],
  (todos, searchTerm, searchView) => {
    return todos.filter(todo => todo.title.match(new RegExp(searchTerm, 'i')));
  }
);

Как вы можете заметить, параметры для createSelector. Как мы знаем, createSelector ожидает 2 аргумента: массив входных селекторов в качестве 1-го аргумента и функцию в качестве 2-го аргумента.

В этом случае массив входных селекторов равен 3. ([todoSelector, searchTermSelector, searchViewSelector])

Но в моем фактическом коде массив селекторов ввода равен 9. Мне нужно уменьшить количество с 9 до менее 4 из-за проблем с эхолотом.

Как я могу свести к минимуму массив селекторов ввода и при этом заставить его работать должным образом. Я много ищу в Интернете, но я не нашел ничего, связанного с этим. Пожалуйста, любые предложения?


reactjs javascript redux react-redux reselect
person ashwin prabhu    schedule 15.06.2020    source источник
comment
Вам нужно предоставить лучший пример, демонстрирующий вашу проблему. В настоящее время ваш пример имеет searchViewSelector в качестве одного из своих входов, но значение searchView затем игнорируется, поэтому, следуя приведенному примеру, вы можете просто удалить searchViewSelector из входов селектора. Если вам нужен реальный совет, вы должны продемонстрировать реальную проблему.   -  person HMR    schedule 15.06.2020

Ответы (1)


arrow_upward
0
arrow_downward

Если вы хотите уменьшить количество аргументов для каждой функции выбора, вы можете разделить логику на несколько частей и использовать результат функции createSelector в качестве аргумента для другой функции createSelector. Что-то вроде этого:

const todoSelector = state => state.todo.todos;
const searchTermSelector = state => state.todo.searchTerm;
const searchViewSelector = state => state.todo.userView

export const filteredTodosByTerm = createSelector(
  [todoSelector, searchTermSelector],
  (todos, searchTerm) => {
    return todos.filter(todo => todo.title.match(new RegExp(searchTerm, 'i')));
  }
);

export const filteredTodosByView = createSelector(
  [filteredTodosByTerm, searchViewSelector],
  (todos, searchView) => {
    return todos.filter(todo => todo.title.match(new RegExp(searchView, 'i')));
  }
);
)
person Raj    schedule 15.06.2020