javascript - reducer 没有返回预期的空对象

Question

在这里使用 React-redux 并遇到一些问题，你们中的一些人可能会帮忙解决。

用户可以创建“职位”(帖子)，也可以删除它们。添加它们没有问题，并且 reducer 返回预期的结果。但是，一旦我从(firebase)数据库中删除作业，我就会触发当前作业的新获取，但 reducer 仍然返回旧作业。我错过了什么吗？

删除之前，作业对象如下所示:

activeJobs= {
  -KrkPPy4ibSraKG-O49S: {
    title: 'Help',
    location: 'etc,
    ...
  },
  -KrkPPy4ibSraKG-O49S: {
    title: 'Help',
    location: 'etc,
    ...
  } and so on
}

当我将它们全部删除时，我会从服务器取回此 {}。预期的。出乎意料的是，我的 reducer 仍然返回旧作业，并且我的组件不会重新渲染。

我在获取作业后调度一个操作:

firebase.database().ref(`/jobs/activeJobs/${currentUser.uid}`)
      .on('value', snapshot => {

        console.log('new activeJobs ===', snapshot.val());

        dispatch({
          type: FETCH_JOBS_SUCCESS,
          payload: snapshot.val()
        });
      });

snapshot.val() 确实包含新更新的作业。

然后这是处理该操作的 reducer :

switch (action.type) {
case FETCH_JOBS_SUCCESS:

  // ...state contains the OLD jobs and action.payload contains {}. Why is is not overriding it the old jobs?

  return { ...state, ...action.payload  };
default:
  return state;
}

为什么我的 reducer 出现故障？

Answer 1

{ ...state, ...action.payload } 语法的实际含义是:通过获取 state 的每个 props 并添加每个 props 来构建一个新对象action.payload。在你的例子中，你只是得到一个类似于状态的新对象，因为 ...action.payload 是一个空对象。