我认为你应该在这里只发送一个操作:addBookmark()
,它接受书签对象和文件夹。
您处理将书签对象添加到文件夹的代码应该是减速器的一部分。
另外,请参考待办事项示例 https://github.com/reactjs/redux/blob/master/examples/todos/actions/index.js在 Redux 项目中。它在创建动作时提供了 id,以便可以在组件中读取它。您还可以使用当前状态来计算最新的 id:
function addBookmark(bookmark, folder) {
return (dispatch, getState) => {
const newBookmark = Object.assign({
id: Math.max(0, ...getState().bookmarks.map(b => b.id)) + 1,
}, bookmark);
dispatch({
type: 'ADD_BOOKMARK',
bookmark: newBookmark,
folder: folder
});
}
}
请注意,该示例需要redux-thunk https://github.com/gaearon/redux-thunk调度这些操作的中间件。
然后您可以在文件夹缩减器中访问带有 id 的书签
function folderReducer(state = [], action) {
if(action.type === 'ADD_BOOKMARK') {
return state.map(folder => {
if(folder === action.folder) {
return Object.assign({}, folder, {children: [...folder.children, action.bookmark.id]}
}
return folder;
})
}
//another reducer code
return state;
}