Question

我试图重置数据，并希望进入初始状态，我知道不变性在这部分中扮演着重要角色。

以下是我的商店数据（Flow Completed data）

  animalSense: {
    selectedVision: 'dayLight',
    selectedState: 'california',
    viewedVisions: ['dayLightcalifornia', 'dayLightsouthAfrica', 'nightVisioncalifornia'],
    viewedAnimals: ['dog', 'cat']
  },

我想将其替换为以下数据

  animalSense: {
    selectedVision: '',
    selectedState: '',
    viewedVisions: [''],
    viewedAnimals: []
  },

我知道以下操作是直接且正确的方式来添加初始数据

export const RESET_ANIMAL_SENSES = 'actions/reset_animal_senses';

export default () => ({
  type: RESET_ANIMAL_SENSES,
  payload: {
    selectedVision: '',
    selectedState: '',
    selectedAnimal: '',
    viewedVisions: [''],
    viewedAnimals: []
  }
});

但上述行为保持相同的统计数据 e

以下操作是工作解决方案，但我不知道这是一个正确的方法

export const RESET_ANIMAL_SENSES = 'actions/reset_animal_senses';

const data = JSON.stringify({
  selectedVision: '',
  selectedState: '',
  selectedAnimal: '',
  viewedVisions: [''],
  viewedAnimals: []
});
export default () => ({
  type: RESET_ANIMAL_SENSES,
  payload: JSON.parse(data)
});

当我们使用stringify时，连接已经结束并且添加了新状态，但我不知道为什么没有JSON.stringify（）这不起作用？

减速机

import { SELECT_VISION } from '../actions/select_vision_type';
import { CHANGE_ANIMAL_VIDEO_STATE } from '../actions/change_animal_video_state';
import { UPDATE_ANIMALS } from '../actions/update_animals';
import { RESET_ANIMAL_SENSES } from '../actions/reset_animal_senses';

export default (state = {}, action) => {
  let newState = state;
  switch (action.type) {
    case SELECT_VISION:
      newState = { ...state, ...action.payload };
      break;
    case CHANGE_ANIMAL_VIDEO_STATE:
      newState = { ...state, ...action.payload };
      break;
    case UPDATE_ANIMALS:
      newState = { ...state, ...action.payload };
      break;
    case RESET_ANIMAL_SENSES:
      newState = { ...state, ...action.payload };
      break;
    default:
      break;
  }
  return newState;
};

Answer 1

有效负载中的

传播运营商解决了这个问题

export const RESET_ANIMAL_SENSES = 'actions/reset_animal_senses';
const data = {
    selectedVision: '',
    selectedState: '',
    selectedAnimal: '',
    viewedVisions: [''],
    viewedAnimals: []
};
export default () => ({
  type: RESET_ANIMAL_SENSES,
  payload: { ...data } // here is the solution
});

Answer 2

试试这个，我为你的减速机做了很多重构。

import { SELECT_VISION } from '../actions/select_vision_type';
import { CHANGE_ANIMAL_VIDEO_STATE } from '../actions/change_animal_video_state';
import { UPDATE_ANIMALS } from '../actions/update_animals';
import { RESET_ANIMAL_SENSES } from '../actions/reset_animal_senses';


const initialState = {
  selectedVision: '',
  selectedState: '',
  selectedAnimal: '',
  viewedVisions: [''],
  viewedAnimals: []
}

export default (state = initialState, action) => {
  switch (action.type) {
    // since all the cases have common code.
    case SELECT_VISION:
    case CHANGE_ANIMAL_VIDEO_STATE:
    case UPDATE_ANIMALS: {
        return { ...state, ...action.payload }
    }
    case RESET_ANIMAL_SENSES: {
        return { ...initialState }
    }
    default: {
        return state;
    }
  }
};

尝试一次减速机。但是，目前我还不清楚为什么它会与stringify一起使用。

了解Redux Action上的JSON.stringify（）？

2 个答案: