Redux Saga Dynami c Типы действий?

Question

Я занимаюсь разработкой приложения. На экране Настройки у меня есть список Switch, который обновит API. Как я могу работать с Dynami c action_types и обрабатывать это в Reducer .

Scenerio Мне нужно

1. Каждое состояние коммутатора должно вызывать sampleAction
2. Для тех же switch отводов takeLatest последний звонок должен быть рассмотрен
3. Я могу нажать несколько switch одновременно.

Например :) Если я нажму 5 разных кнопок, 5 вызовов API должны go, но если я переключаюсь между одним и тем же коммутатором 5 раз, следует учитывать только последний.

Пример действия с динамиком c тип 'ключ'

export const sampleAction = (key) => {
    return {
        type: SETTINGS.ACTION_CHANGE + key
    };
};

Любые решения ???

Answer 1

Вы можете попробовать этот способ

export const sampleAction = (key) => {
  return {
      type: SETTINGS.ACTION_CHANGE + key,
      payload: key
  };
};

Ваш редуктор

export default (state = initialState, action) {
  switch (`${action.type}${action.payload}` ) {
    case `${SETTINGS.ACTION_CHANGE}${action.payload}`:
      return {your new state}
    default:
      return state
  }
}

Answer 2

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

То, что вы хотите сделать, на самом деле не возможно. Возьмите свой пример

export const sampleAction = (key) => {
    return {
        type: SETTINGS.ACTION_CHANGE + key
    };
};

Как будет выглядеть ваш редуктор? Это не может быть case SETTINGS.ACTION_CHANGE + key Какой ключ?

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

function* saga(action) {
    if (action.payload === 'SETTING_1') {
        // Do stuff for that setting.
    }
}

export function* sagas() {
    yield takeEvery(SETTING.ACTION_CHANGE, saga);
}

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

Итак, решение этой проблемы было бы чем-то из следующего:

function* saga(action) {
    if (action.payload === 'SETTING_1') {
        yield put({ type: SETTING_1 });
    }
}

function* settingOne(action) {
    // Do stuff for setting 1.
}

export function* sagas() {
    yield takeEvery(SETTING.ACTION_CHANGE, saga);
    yield takeLatest(SETTING_1, settingOne);
}

Теперь вы делаете именно то, что вам нужно, вы используете takeEvery для каждого щелчка переключателя, но если один и тот же переключатель нажимался несколько раз, тогда takeLatest вступает в силу место.

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

Что означает, что будет быть лучшим способом на мой взгляд. Забудьте о динамических c вещах (я знаю, что вы хотите иметь меньше действий и т. Д.) И сделайте их простыми, например:

function* settingOne(action) {
    // Do stuff for setting 1.
}

export function* sagas() {
    yield takeLatest(SETTING_1, settingOne);
 }

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

Надеюсь, этот тип прояснит, почему типы действий Dynami c не будут работать. По крайней мере, это то, что я знаю, может быть, есть способ, о котором я не слышал :)

Answer 3

Почему бы вам не использовать полезную нагрузку для этого! пример:

export const sampleAction = (key) => {
    return {
        type: SETTINGS.ACTION_CHANGE,
        payload:{key}
    };
};