Question

我的数据如下：

{

  '004': [
      {
          year_week: '2020-W1',
          actual_bank_amount: '6500000',
          ext_in_rental_income: '',
          ext_in_tax_refund: '',
          ext_in_dividends_income: ''
      },
      {
          year_week: '2020-W2',
          actual_bank_amount: '6500000',
          ext_in_rental_income: '',
          ext_in_tax_refund: '',
          ext_in_dividends_income: ''
      }

  ],
  '007': [
      {
          year_week: '2020-W22',
          actual_bank_amount: '65050000',
          ext_in_rental_income: '30000',
          ext_in_tax_refund: '',
          ext_in_dividends_income: ''
      }

  ]
},

我正在尝试在'004'中更新year_week'2020-W1'的日期。

动作和减速器没问题，但是列表中的数据没有更新。

以下是我的减速器：

case 'UPDATE':
  state.planningData[action.payload.currentSite].map((item, index) => {
    if (item.year_week === action.payload.data.year_week) {
      return Object.assign({}, item, action.payload.data);
    }
    return item;
  });
  console.log(state)

  return {
    loading: true,
    planningData: state.planningData,
    error: ''
  }

请问我在做什么错。顺便说一句，当我执行控制台日志或运行redux扩展时，我看到了更新状态。

以下是我的动作创建者：

export const update = (data) =>

    (dispatch, getState) => {
        console.log("Update action called" + JSON.stringify(data))
        const currentSite = getState().sites.currentSite;
        dispatch({
            type: 'UPDATE',
            payload: {
                data: data,
                currentSite: currentSite
            }

        });
    };

顺便说一句，我是从“输入”的可编辑单元格组件调用它的，下面的模糊事件是我的代码

 const save = async e => {
        try {
            const values = await form.validateFields();

            toggleEdit();
            dispatch(update({ ...record, ...values }));
        } catch (errInfo) {
            console.log('Save failed:', errInfo);
        }
    };

Answer 1

这不是很漂亮，但是可以。您的状态中有一些嵌套数据，并且没有正确更新。


    case "UPDATE":
      let updatedPlanningData = {};
      for (let prop in state.planningData) {
        if (prop === action.payload.currentSite) {
          updatedPlanningData[action.payload.currentSite] = state.planningData[
            action.payload.currentSite
          ].map((item, index) => {
            if (item["year_week"] === action.payload.data.year_week) {
              return Object.assign({}, item, action.payload.data);
            }
            return item;
          });
        } else {
          updatedPlanningData.prop = state.planningData[prop];
        }
      }
      return {
        loading: true,
        planningData: updatedPlanningData,
        error: ""
      };

这是codesandbox

中的示例代码

编辑：更紧凑的解决方案

let updatedPlanningData = {...state.planningData};

updatedPlanningData[action.payload.currentSite].map((item, index) => {
        if (item["year_week"] === action.payload.data.year_week) {
          return Object.assign(item, action.payload.data);
        }
        return item;
      });

React Redux功能组件更新状态不起作用

1 个答案: