我已经完成了创建通用排序归约器的方法。这个想法是调用一个动作,然后通过action.meta中的一个字段对其进行过滤。
方法如下:
const initalStateSorting = {
sortKey: undefined,
sortOrder: "ASC"
}
const createSortingReducer = (endpoint) => {
const sorting = (state = {}, action = {}) => {
switch (action.type) {
case 'SET_SORT': {
return {
sortKey: action.payload.sortKey,
sortOrder: action.payload.sortOrder
}
}
case 'RESET_SORT': {
return initalStateSorting
}
default:
return initalStateSorting
}
}
return (sorting)
}
使用这种方法,我可以创建其他通用的reducer:
const photos = createSortingReducer('photos')
const text = createSortingReducer('text')
const sorting = combineReducers({
photos,
text
})
export default sorting
这种通用方法的问题在于,当我调用'SET_SORT'操作时,我正在设置照片缩小器和文本缩小器的排序。
是否有办法将输入操作过滤到相应的端点?哪种方法可以实现这一目标?
答案 0 :(得分:0)
在化简器中,您可以创建一个对象并设置相应的特定端点化简器的值,即照片通过照片并设置与照片相对应的排序,例如-在化简器中创建这样的对象
{
...state,{
photos:{
sortKey: action.payload.sortKey,
sortOrder: action.payload.sortOrder
}
}
}
类似地对文本进行处理,然后您可以首先从对应于终结点的状态中过滤值,然后设置其值,以免产生多份副本。
答案 1 :(得分:0)
最后,我决定采用以下解决方案:
这里有动作创建者:
import { createAction } from 'redux-actions'
const createSorting = (endpoint) => {
const setSort = (sort) => {
return {
type: `SET_SORT_${endpoint}`,
payload: {
sortKey: sort.sortKey,
sortOrder: sort.sortOrder
}
}
}
const resetSort = () => {
return {
type: `RESET_SORT_${endpoint}`
}
}
return {
setSort,
getSort,
resetSort
}
}
export const testSorting = createSorting('TEST')
并且,可以使用每个创建的键来创建化简器。这样的想法是,您将拥有一个独立的动作接收者(也许最好在以后的redux版本中决定该选项)。这是示例:
import { combineReducers, createStore } from 'redux'
import { handleActions } from 'redux-actions'
import Immutable from 'immutable'
const SORT_ASC = 'asc'
const SORT_DESC = 'desc'
const defaultSortOrder = SORT_ASC
const initalStateSorting = {
sortKey: undefined,
sortOrder: defaultSortOrder
}
const test= handleActions({
SET_SORT_TEST: (state, action) => {
return {
sortKey: action.payload.sortKey,
sortOrder: action.payload.sortOrder
}
},
RESET_SORT_TEST: (state, action) => {
return initalStateSorting
},
}, initalStateSorting)
const sorting = combineReducers({
test
})
export default sorting