Question

我现在正在改变我的defaultState（我的整个reducer）：

import _ from 'lodash';

import { SIGN_UP_STEP, RESET_SIGN_UP } from '../actions/sign-up';

const defaultState = {
  ui: {
    loading: false
  }, metadata: {
    step: 1,
    code: null
  },
  data: {
    name: null,
    email: null,
    password: null,
    number: null,
    access_token: null
  }
}

export default function signUpReducer(state = defaultState, action) {
  switch(action.type) {
  case SIGN_UP_STEP:
    return _.merge({}, state, action.data)
  case RESET_SIGN_UP:
    return defaultState;
  default:
    return state;
  }
}

我的行动现在就像这样

import request from 'axios';
import _ from 'lodash';

const BACKEND_ROOT = process.env.API_ROOT || 'http://localhost:3000';

export const SIGN_UP_STEP = 'SIGN_UP_STEP';
export const RESET_SIGN_UP = 'RESET_SIGN_UP';

export function signUpStep(data) {
  return {
    type: SIGN_UP_STEP,
    data
  }
}

...

但是现在我在想我应该如何构建或者我应该如何做到这一点。如果我应该从组件发送到操作或从动作到减速器进行格式化。

喜欢，我应该这样做：

// component
const signUpAction = SignUpActions.signUpStep({
  step: 2,
  name: this.refs.name.value,
  email: this.refs.email.value,
  password: this.refs.password.value
});
dispatch(signUpAction);

// action
export function signUpStep(data) {
  return {
    type: SIGN_UP_STEP,
    {
      metadata: {
        step: data.step
      },
      data: data.data
    }
  }
}

或者在发送之前先将其格式化？

// component
const signUpAction = SignUpActions.signUpStep({
  metadata: {
    step: 2,
  },
  data: {
    name: this.refs.name.value,
    email: this.refs.email.value,
    password: this.refs.password.value
  }
});
dispatch(signUpAction);

// action
export function signUpStep(data) {
  return {
    type: SIGN_UP_STEP,
    data
  }
}

Answer 1

我在评论中同意@Kai，但为了进一步采取行动，我更倾向于采取行动来展示合同。

export function signUpStep(name, email, password, ...args){
  return { type: SIGN_UP_STEP,
    metadata: {
      step: 2
    },
    data: {name, email, password, ..args}
  }
}

// to call
signUpStep("John", "john@example.com", "Pass1", "doej");

// to access "doej" parameter from function
const githubId = args[0];

显然，这是所有个人偏好，但在上面的部分中，您现在公开了一个明确的合同，其中包含操作所需的必要字段，而无需阅读操作。

我应该如何在redux中构建/传递我的数据或操作

1 个答案: