Подтвердить что ты не робот

Как разделить логику между редукторами Redux и создателями действий?

У меня есть какая-то логика, которую я поставил в редукторе, который, как я думаю, должен быть помещен в действие и передан?

Лучше ли использовать такие вещи в действиях или редукторе?

Рабочий пример здесь.

Код редуктора:

function Card() {
  this.card = (Math.random()*4).toFixed(0);
}

Card.prototype = {
  getRandom: function(){
    var card;
    //console.log(this.card)
    switch (this.card) {
      case '1':
      card = 'heart';
      break;
      case '2':
      //card = 'diamonds';
      card = 'heart'; // weight the odds abit
      break;
      case '3':
      card = 'club';
      break;
      case '4':
      card = 'spade';
      break;
      default:
      card = 'heart';
      break;
    }
    return card;
  }
}

var dealer = {
  deal: function(){
    var results = [];
    for(var i = 0; i <4; i++){
      var card = new Card();
      results.push(card.getRandom());
    }
    console.log(results);
    return results;
  }
}


const initialState = {
  count: 0,
  data: []
}

function counter (state = initialState, action) {
  let count = state.count
  switch (action.type) {
    case 'increase':
      return Object.assign({}, state, {
        data: dealer.deal(),
        count: state.count+1
      })
    default:
      return state
  }
}
4b9b3361

Ответ 1

Ваш редуктор должен быть чистым. В настоящее время это не чисто. Он вызывает deal(), который вызывает getRandom(), который полагается на Math.random() и, следовательно, не является чистым.

Этот тип логики ( "генерация данных", будь то рандомизированный или пользовательский ввод) должен быть в создателе действия. Создатели действий не должны быть чистыми и могут безопасно использовать Math.random(). Этот создатель действия вернет действие, объект, описывающий изменение:

{
  type: 'DEAL_CARDS',
  cards: ['heart', 'club', 'heart', 'heart']
}

Редуктор просто добавит (или заменит?) эти данные внутри состояния.

Как правило, начинать с объекта действия. Он должен описывать изменение таким образом, что запуск редуктора с тем же объектом действия и тем же предыдущим состоянием должен возвращать одно и то же следующее состояние. Вот почему редуктор не может содержать вызовы Math.random() - они нарушат это условие, так как они будут случайными каждый раз. Вы не сможете проверить свой редуктор.

После того, как вы выясните, как выглядит объект действия (например, выше), вы можете написать создатель действия для его создания и редуктор, чтобы преобразовать состояние и действие в следующее состояние. Логика для генерации действия находится в создателе действия, логика реагирования на него находится в редукторе, редуктор должен быть чистым.

Наконец, не использовать классы внутри состояния. Они не являются сериализуемыми, как есть. Вам не нужен класс Card. Просто используйте простые объекты и массивы.

Ответ 2

Я понимаю, что действия должны быть простыми объектами, которые содержат две вещи: (i) тип действия и (ii) то, что изменилось (т.е. новые данные).

Редукторы, с другой стороны, являются чистыми функциями, которые принимают действия и предыдущее состояние приложения в качестве входных данных и возвращают новое состояние приложения. Как они это достигают, зависит от вас. Вы можете добавить любую логику, необходимую для сочетания предыдущего действия "состояние +" и вернуть новое состояние, пока вы не мутируете данные вне функции (-ов) редуктора.

Что касается вашего кода, я не уверен, что функция deal() принадлежит либо к действию, либо к редуктору. Я думаю, что лучшее место может быть в каком-то обработчике событий (например, onClick). Затем вы можете передать результаты вызова сделки в качестве действия для вашего редуктора.

Ответ 3

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

Я полагаю, что имеет смысл сохранить чистое хранилище и цепочки действий.

Сначала это может выглядеть как много реплицированного кода, но когда вы начинаете отправку на основе условий или должны отправляться из нескольких мест, он начинает открываться и иметь смысл.