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。
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
  • 相关阅读:
    iOS中循环引用的解除
    Block的循环引用详解
    Mac OS X下面 Node.js环境的搭建
    swift中闭包和OC的block的对比
    STL priority_queue
    优先使用map(或者unordered_map)的find函数而非algorithm里的find函数
    Insert Interval
    Integer Break
    Unique Binary Search Trees
    腾讯2016实习生笔试
  • 原文地址:https://www.cnblogs.com/wy1935/p/7092900.html
Copyright © 2011-2022 走看看