高阶reducer

[xiaoxiaosaohuo]

高阶函数是指将函数作为参数或返回值的函数，高阶reducer就是指将reducer作为参数或返回值的函数。目的是reducer复用

例1：

//example.js
import { combineReducers } from "redux"
import users from "./users"
import articles from "./articles"

const add = (reducer, predicate) => (state, action) => {
  if (predicate(action.type)) {
    return [...state, action.payload]
  }
  return reducer(state, action)
}

const rootReducer = combineReducers({
  users: add(users, type => type === "ADD_USER"),
  articles: add(articles, type => type === "ADD_ARTICLE")
})

export default rootReducer

例2：

import { combineReducers, compose } from "redux"
import users from "./users"
import articles from "./articles"

const add = section => reducer => (state, action) => {
  if (action.type === `ADD_${section}`) {
    return [...state, action.payload]
  }
  return reducer(state, action)
}

const remove = section => reducer => (state, action) => {
  if (action.type === `REMOVE_${section}`) {
    return state.filter(item => item !== action.payload)
  }
  return reducer(state, action)
}

const sectionReducer = section => compose(add(section), remove(section))

const rootReducer = combineReducers({
  users: sectionReducer("USER")(users),
  articles: sectionReducer("ARTICLE")(articles)
})

export default rootReducer

users.js

//users.js

export default (state = [], { type, payload }) => {
  switch (type) {
    // case "ADD_USER":
    //   return [...state, payload]

    default:
      return state
  }
}