zoukankan      html  css  js  c++  java
  • Redux学习笔记------reducer

    reducer要做的事就是怎样更新状态

    reducer是一个纯函数,接收旧的state和acion返回新的state

    reducer的禁止:

    • 修改传入参数;
    • 执行有副作用的操作,如 API 请求和路由跳转;
    • 调用非纯函数,如 Date.now() 或 Math.random()。
    • const initialState = {
        visibilityFilter: VisibilityFilters.SHOW_ALL,
        todos: []
      };
      function todoApp(state = initialState, action) {
        switch (action.type) {
          case SET_VISIBILITY_FILTER:
            return Object.assign({}, state, {
              visibilityFilter: action.filter
            })
          default:
            return state
        }
      }

      不要修改 state 使用 Object.assign() 新建了一个副本。不能这样使用 Object.assign(state{visibilityFilter: action.filter }),因为它会改变第一个参数的值。你必须把第一个参数设置为空对象。在 default 情况下返回旧的 state遇到未知的 action 时,一定要返回旧的 state

     combineReducers():

    两种等价的方法

    import { combineReducers } from 'redux';
    
    const todoApp = combineReducers({
      visibilityFilter,
      todos
    })
    
    export default todoApp;
    export default function todoApp(state = {}, action) {
      return {
        visibilityFilter: visibilityFilter(state.visibilityFilter, action),
        todos: todos(state.todos, action)
      }
    }

    或者添加KEY两种等价的方法(key是用来筛选出state中的你所需要的数据进行处理)

    const reducer = combineReducers({
      a: doSomethingWithA,
      b: processB,
      c: c
    })
    function reducer(state = {}, action) {
      return {
        a: doSomethingWithA(state.a, action),
        b: processB(state.b, action),
        c: c(state.c, action)
      }
    }
  • 相关阅读:
    解决docker pull很慢的方法
    Linux 基础 Day1
    linux运维人员必须熟悉的运维工具汇总
    chrome 浏览器插件推荐
    只能运维主要职责
    Linux查看所有用户用命令
    ubuntu16.04 离线包安装docker
    2013-10
    ELK原理与介绍
    shell中各种括号的作用()、(())、[]、[[]]、{}
  • 原文地址:https://www.cnblogs.com/pengshuo/p/6640541.html
Copyright © 2011-2022 走看看