Форма Redux должна отображать мои отфильтрованные значения в браузере - PullRequest
Новая
       292

Форма Redux должна отображать мои отфильтрованные значения в браузере

1 голос
/ 14 марта 2019

Используя форму Redux, я могу получить значения, которые я ввожу в имени пользователя. Я могу отфильтровать соответствующие значения, но мне нужно отобразить отфильтрованные значения в браузере. 

console.log("pilot.name--->", pilot.name);

Можете ли вы сказать мне, как это сделать? Я предоставил свой фрагмент кода и песочницу ниже. Мой связанный код находится в showResults.js: https://codesandbox.io/s/xl1r14w854.

var pilots = [
    {
      id: 2,
      name: "Wedge Antilles",
      faction: "Rebels"
    },
    {
      id: 8,
      name: "Ciena Ree",
      faction: "Empire"
    },
    {
      id: 40,
      name: "Iden Versio",
      faction: "Empire"
    },
    {
      id: 66,
      name: "Thane Kyrell",
      faction: "Rebels"
    }
  ];

  var rebels = pilots.filter(function(pilot) {
    // return pilot.faction === "Rebels";
    // return pilot.faction === values.username;

    if (pilot.faction === values.username) {
      console.log("pilot.name--->", pilot.name);
    }
  });

1 Ответ

0 голосов
/ 15 марта 2019

Я предлагаю использовать для этого отдельный редуктор. Представьте, что вы называете этот редуктор PilotsReducer, где у вас есть список пилотов в штате. Этот редуктор «слушает» определенное действие, например loginSubmitted, которое вы запускаете, когда получаете ответ от сервера.

Полезной нагрузкой этого действия будет имя пользователя, которое вы используете для фильтрации. В редукторе вы можете выполнить фильтр и установить свойство состояния (например, rebels) для результата фильтра. Затем ваш компонент может быть присоединен к redux для выбора свойства rebels, и он будет повторно отображаться при изменении этого свойства.

Это типичный поток реакции / редукса, он не относится к вашему примеру

В примечании вы можете улучшить его, используя reselect, чтобы сохранить весь список пилотов в состоянии и отфильтровать их в selector, передав ему текущее имя пользователя. Пожалуйста, ознакомьтесь с документацией и учебными пособиями по редуксу и повторно выберите, чтобы иметь четкое представление обо всем рабочем процессе.

...