zoukankan      html  css  js  c++  java
  • 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() 方法来生成。

  • 相关阅读:
    1scala基础
    3scala高级
    03spark kafka
    01spark基础
    04spark streaming
    2scala集合
    02spark sql
    学习java程序设计环境的心得
    第五章继承
    第二周学习Java心得
  • 原文地址:https://www.cnblogs.com/pengshuo/p/6645573.html
Copyright © 2011-2022 走看看