• Redux学习笔记------容器组件与展示组件分离


    展示组件含义:

    关心组件的展示的样子

    可以包含一些展示组件和容器组件,有自己的DOM标记和样式

    通常可以通过this.props.children进行控制。

    对应用程序的其余部分没有依赖关系,例如Flux操作或store。

    不指定数据的加载和变化

    通过props接收数据和回调

    很少有它们自己的state,有也是UI状态而不是数据

    被编写为功能组件,除非它们需要状态,生命周期或性能优化。

    容器组件的含义:

    关心组件的工作方式

    可以包含一些展示组件和容器组件,没有有自己的DOM标记除了包含性的div和没有自己的样式

    提供数据和行为给展示组件或者其他的容器组件

    调用action,并作为回调给展示组件

    通常是有状态的,往往作为数据源

    通常使用更高阶的组件,如来自React Redux的connect(),来自Relay的createContainer()或来自Flux Utils的Container.create()生成的,而不是用手编写。

     展示组件容器组件
    作用 描述如何展现(骨架、样式) 描述如何运行(数据获取、状态更新)
    直接使用 Redux
    数据来源 props 监听 Redux state
    数据修改 从 props 调用回调函数 向 Redux 派发 actions
    调用方式 手动 通常由 React Redux 生成

    可以直接使用 store.subscribe() 来编写容器组件。但不建议这么做因为就无法使用 React Redux 带来的性能优化。也因此,不要手写容器组件,都是使用 React Redux 的 connect() 方法来生成。

  • 相关阅读:
    拷贝构造函数 转型构造函数
    构造函数对const成员的初始化
    拷贝构造函数
    类数据成员和类成员函数
    顶层函数进行操作符重载与操作符重载直接作为类的构造函数
    构造函数和new 与new【】 析构函数
    Openfire+XIFF实时通信&一个特殊的GP
    客户端数据动态渲染
    数据处理:由面得点,构造其边界
    从GISALL博客搬家而来
  • 原文地址:https://www.cnblogs.com/pengshuo/p/6645573.html
Copyright © 2020-2023  润新知