Question

我是js的新手，并通过redux对js进行反应，我试图不可变地更新全局状态的值，这是我当前的状态

const initialState = {
  questions: [
    {
      id: 1010,
      name: "Inside which HTML element do we put the JavaScript?",
      questionTypeId: 1,
      options: [
        {
          id: 10,
          name: "javascript",
          isAnswer: false,
          isSelected: false
        },
        {
          id: 11,
          name: "scripting",
          isAnswer: false,
          isSelected: false
        },
        {
          id: 12,
          name: "script",
          isAnswer: true,
          isSelected: false
        },
        {
          id: 13,
          name: "js",
          isAnswer: false,
          isSelected: false
        }
      ]
    },
    {
      id: 1011,
      name: "Javascript is a langague used for ?",
      questionTypeId: 2,
      options: [
        {
          id: 14,
          name: "ConsoleApp",
          isAnswer: false,
          isSelected: false
        },
        {
          id: 15,
          name: "ShellApp",
          isAnswer: false,
          isSelected: false
        },
        {
          id: 16,
          name: "WebApp",
          isAnswer: true,
          isSelected: false
        },
        {
          id: 17,
          name: "MobileApp",
          isAnswer: false,
          isSelected: false
        }
      ]
    },
    {
      id: 1012,
      name: "What is the full form of SPA?",
      questionTypeId: 3,
      options: [
        {
          id: 18,
          name: "Secured and Progressive App",
          isAnswer: false,
          isSelected: false
        },
        {
          id: 19,
          name: "Single Page Application",
          isAnswer: false,
          isSelected: false
        },
        {
          id: 20,
          name: "SOLID Principles for Application",
          isAnswer: true,
          isSelected: false
        },
        {
          id: 21,
          name: "None of the above",
          isAnswer: false,
          isSelected: false
        }
      ]
    }
  ],
  Currentquestion: []
};

我想从问题数组中将 isSelected 值更改为true，该问题数组的索引为 questionTypeId：1 ，然后为index：0的options数组下面是我尝试将ui的状态 action.payload 的值不变地更改为1，而ui的 action.value的值是0的变径器。

case SELECT_ANS: {
      const question = action.payload;
      const index = action.value;
      // const newstate = produce(state, draftsate => {
      //   draftsate.questions[question].options[index].isSelected = true;
      // });
      return {
        ...state,questions:[
          {
            ...state.questions[question],options:[{
              ...state.questions[question].options[index],isSelected:true
            }]
          }
        ]
          ]
        ]
      };

如果我对任何遗漏或不适当的内容感到抱歉，我会尽我所能地提供所有信息，对任何解释的帮助将不胜感激，谢谢您

Answer 1

起初，我注意到您将操作的数据分为action.payload和action.value，这与the flux principles相反。您必须将数据对象放入action.payload中，并像action.payload.questionTypeId和action.payload.index那样得到它。

好吧，您可以像这样更改商店

case SELECT_ANS: {
  return {
    ...store,
    questions: store.questions.map((question) => {
      if (question.questionTypeId === action.payload.questionTypeId) {
        return {
          ...question,
          options: question.options.map((option, index) => {
            if (index === action.payload.index) {
              return {
                ...option,
                isSelected: true,
              };
            }

            return option;
          }),
        };
      }

      return question;
    }),
  };
};

如果我对您的问题的回答不够充分，您可以在redux docs中获取更多信息，也可以亲自问我。

祝你好运！

如何不变地更改或更新状态的特定值

1 个答案: