zoukankan      html  css  js  c++  java
  • React-Redux入门

    1、概念

    • react只是一个轻量级的视图层框架,如果要做大型应用就要搭配视图层框架redux一起使用
    • redux组件之间的传值非常简单,redux里面要求我们把数据都放在一个公共的存储区域store里面,组件之中尽量少放数据,也就是所有数据都不放在组件自身了,都把它放到一个公用的存储空间里面,然后组件改变数据就不需要传递了,改变store里面的数据之后其它的组件会感知到里面的数据发生改变。这样的话不管组件的层次有多深,但是走的流程都是一样的,会把数据的传递简化很多。

    2、Redux的工作流程

    5,Action和Reducer的作用

    1)要想更新state中的数据,首先派发一个action,action通过dispatch方法传给store。
    2)store把之前的数据previousState和传过来的action转发给reducers函数。
    3)reducers接收state和action后进行数据处理,重新生成一个newState(原state只读不改),把newState作为返回值返回给store。
    4)store接收newState,将新数据替换原来的数据。
    5)react组件中观测到数据发生改变(store.subscribe),会从store里面重新取数据(state),更新组件的内容,页面发生变化。

    actionTypes 拆分管理,统一管理,方便排错
    使用actionCreator统一创建action

    6、redux知识点

      • redux三个基本原则:
        ①:store必须是唯一的
        ②:只有store可以改变自己的内容
        ③:reducer 必须是纯函数

      • 只有store能改变自己内容说明在reducer里我们不能直接操作state,只能通过定义新变量copy state的值,
        然后对新变量进行操作并 return 出新变量,不允许直接改变state。

      • 什么是纯函数?
        给固定的输入,就一定会有固定的输出,并且不会有任何副作用。
        所以对于异步函数(定时器、ajax数据请求等)、动态时间都不适意在reducer里订阅。

      • store核心api:
        crerteStore(): 创建一个store
        store.dispatch(action): 派发action,传递store
        store.getState(): 获取store的所有数据
        store.subscribe(): 订阅store的变化,接收的回调函数在store改变时候就会自动执行

    参考: https://blog.csdn.net/qq3399013670/article/details/93332598

       https://blog.csdn.net/Rance_King/article/details/106317917

    Redux 入门教程(一):基本用法 ( 阮一峰

      http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_one_basic_usages.html

      好的参考:https://segmentfault.com/a/1190000010851224

  • 相关阅读:
    python正则表达式
    正则表达式
    python装饰器
    冒泡排序算法与递归
    C语言typedef定义结构体数组,下面这段代码是什么意思?
    链表实现的简单循环队列
    数组实现的简单循环队列
    悬空指针
    NULL代表什么
    Unity学习——Network Transform和 Network Transform Child组件
  • 原文地址:https://www.cnblogs.com/yizhilin/p/14090371.html
Copyright © 2011-2022 走看看