zoukankan      html  css  js  c++  java
  • react native redux 草稿

    Provider >

    Provider > 使组件层级中的 方法都能够获得 Redux store。正常情况下,你的根组件应该嵌套在 Provider 中才能使用 方法。

    如果你真的不想把根组件嵌套在 <Provider> 中,你可以把 store 作为 props 传递到每一个被 connect() 包装的组件,但是我们只推荐您在单元测试中对 store 进行伪造 (stub) 或者在非完全基于 React 的代码中才这样做。正常情况下,你应该使用 <Provider>。

    属性

    • store (Redux Store): 应用程序中唯一的 Redux store 对象
    • children (ReactElement) 组件层级的根组件。

    https://www.redux.org.cn/docs/react-redux/api.html#provider-store

    https://www.redux.org.cn

    Redux 中文文档

    https://www.ctolib.com/yiransheng-redux-free-flow.html

    https://segmentfault.com/a/1190000019056045

    Rematch: Redux 的重新设计

    https://segmentfault.com/a/1190000019056045

    • Redux 应用只有一个单一的 store。当需要拆分数据处理逻辑时,你应该使用 reducer 组合 而不是创建多个 store;
    • redux一个特点是:状态共享,所有的状态都放在一个store中,任何component都可以订阅store中的数据;
    • 并不是所有的state都适合放在store中,这样会让store变得非常庞大,如某个状态只被一个组件使用,不存在状态共享,可以不放在store中;

    视图层绑定引入了几个概念:

    • <Provider> 组件: 这个组件需要包裹在整个组件树的最外层。这个组件让根组件的所有子孙组件能够轻松的使用 connect() 方法绑定 store。
    • connect():这是 react-redux 提供的一个方法。如果一个组件想要响应状态的变化,就把自己作为参数传给 connect() 的结果,connect() 方法会处理与 store 绑定的细节,并通过 selector 确定该绑定 store 中哪一部分的数据。
    • selector:这是你自己编写的一个函数。这个函数声明了你的组件需要整个 store 中的哪一部分数据作为自己的 props。
    • dispatch :每当你想要改变应用中的状态时,你就要 dispatch 一个 action,这也是唯一改变状态的方法。

    http://www.devio.org/2019/03/13/react-native-redux/

    action和reducer只用于修改state的状态;

    副作用

    准备工作

    根据需要安装以下组件。

    • redux(必选)
    • react-redux(必选):redux作者为方便在react上使用redux开发的一个用户react上的redux库;
    • redux-devtools(可选):Redux开发者工具支持热加载、action 重放、自定义UI等功能;
    • redux-thunk:实现action异步的middleware;
    • redux-persist(可选):支持store本地持久化;
    • redux-observable(可选):实现可取消的action;

    http://www.devio.org/2019/03/13/react-native-redux/

    React Native+Redux开发实用教程

    connect是一个高阶函数,首先传入mapStateToProps、mapDispatchToProps,然后返回一个生产 Component 的函数(wrapWithConnect),然后再将真正的Component作为参数传入wrapWithConnect(MyComponent),这样就生产出一个经过包裹的Connect组件

    https://my.oschina.net/shuaihong/blog/3026278

  • 相关阅读:
    SRM146 DIV1 600
    SRM145 DIV1 1000
    SRM146 DIV1 300
    SRM145 DIV1 600
    【HTML打卡】0115 margin重叠、内联元素、css控制段落
    【HTML打卡】0114 盒模型margin、border、padding
    【HTML打卡】0113 div布局,css控制
    【HTML打卡】0112-html发展、doctype声明
    Machine Learning结课感想
    【ACM打卡】ZOJ 1045 2722 2830
  • 原文地址:https://www.cnblogs.com/feng9exe/p/11166010.html
Copyright © 2011-2022 走看看