zoukankan      html  css  js  c++  java
  • React容器组件和展示组件

     
    展示组件
     
    - 只关心它们的样子。
     
    - 可能同时包含子级容器组件和展示组件,一般含DOM标签和自定的样式。
     
    - 通常用this.props.children来包含其他组件
     
    - 不依赖app其它组件,比如flux的actions和stores
     
    - 不会定义数据如何读取,如何改变
     
    - 只通过this.props接受数据和回调函数
     
    - 很少有自己的状态变量,即使有,也是UI的状态变量,比如toggleMenuOpen,InputFocus
     
    - 一般是函数级组件,除非它们需要状态,lifecycle hooks,优化处理。
     
    容器组件
     
    - 只关心它们的运作方式。
     
    - 可能同时包含子级容器组件和展示组件,但大都不含DOM标签,而含他们自己所用的wrapping div,从不用自己的样式。
     
    - 为展示组件或其他组件提供数据和方法。
     
    - 调用Flux的actions,并且将其作为展示组件的回调函数。
     
    - 维持许多状态变量,通常充当一个数据源。
     
    - 通常由高阶组件生成,比如Redux里的connect(),Relay里的createContainer(),Flux Utils里的Container.create(),而非手工写出(译者:可能在meteor中数据是例外吧)
     
    - 例子有UserPage, FollowersSidebar, StoryContainer, FollowedUserList。
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
  • 相关阅读:
    数组和链表
    IAP升级
    使用Git和Github来管理自己的代码和笔记
    Eeprom和Flash的区别
    程序员的七种武器
    数据结构和算法的关系
    STVD、IAR两种编译器比较
    STM32与STM8操作寄存器的区别
    Linux用户身份与文件权限
    地图缩放到指定经纬度
  • 原文地址:https://www.cnblogs.com/wy1935/p/7092900.html
Copyright © 2011-2022 走看看