Home Question Blog About Message Toolbox

English

如何在Redux中更新特定数组项内的单个值

逆天猿理查德2020-03-12

我遇到一个问题，即状态的重新呈现会导致ui问题，并建议仅更新reducer内的特定值以减少页面上的重新呈现量。

这是我的状态的例子

{
 name: "some name",
 subtitle: "some subtitle",
 contents: [
   {title: "some title", text: "some text"},
   {title: "some other title", text: "some other text"}
 ]
}

我目前正在这样更新

case 'SOME_ACTION':
   return { ...state, contents: action.payload }

其中action.payload是包含新值的整个数组。但是现在我实际上只需要更新内容数组中第二个项目的文本，类似的事情就不起作用

case 'SOME_ACTION':
   return { ...state, contents[1].text: action.payload }

action.payload现在我需要更新的文本在哪里。

TomTom乐2020/03/12 16:27:32

这是我为其中一个项目执行的操作：

const markdownSaveActionCreator = (newMarkdownLocation, newMarkdownToSave) => ({
  type: MARKDOWN_SAVE,
  saveLocation: newMarkdownLocation,
  savedMarkdownInLocation: newMarkdownToSave  
});

const markdownSaveReducer = (state = MARKDOWN_SAVED_ARRAY_DEFAULT, action) => {
  let objTemp = {
    saveLocation: action.saveLocation, 
    savedMarkdownInLocation: action.savedMarkdownInLocation
  };

  switch(action.type) {
    case MARKDOWN_SAVE:
      return( 
        state.map(i => {
          if (i.saveLocation === objTemp.saveLocation) {
            return Object.assign({}, i, objTemp);
          }
          return i;
        })
      );
    default:
      return state;
  }
};

Newest Answer

HTML5 Drag & Drop 拖动时更改图标/光标

如何完全卸载 Node.js，然后从头重新安装 (Mac OS X)

MAC终端删除代理有效命令

vue动态路由跳转同一地址不刷新页面

NUXT引入tailwindcss报错Error: Expected an opening square bracket.