[react] 展示组件和容器组件有什么区别?

[react] 展示组件和容器组件有什么区别?

展示组件(Presentational Component)
关注页面的展示效果(外观)
内部可以包含展示组件和容器组件,通常会包含一些自己的DOM标记和样式(style)
通常允许通过this.props.children方式来包含其他组件。
对应用程序的其他部分没有依赖关系,例如Flux操作或store。
不用关心数据是怎么加载和变动的。
只能通过props的方式接收数据和进行回调(callback)操作。
很少拥有自己的状态,即使有也是用于展示UI状态的。
会被写成函数式组件除非该组件需要自己的状态,生命周期或者做一些性能优化。
Example:Page,Header,Sidebar,UserInfo,List

容器组件(Container Component)
关注应用的是如何工作的
内部可以包含容器组件和展示组件,但通常没有任何自己的DOM标记,除了一些包装divs,并且从不具有任何样式。
提供数据和行为给其他的展示组件或容器组件。
调用Flux操作并将它们作为回调函数提供给展示组件。
往往是有状态的,因为它们倾向于作为数据源
通常使用高阶组件生成,例如React Redux的connect(),Relay的createContainer()或Flux Utils的Container.create(),而不是手工编写。
Example:UserPage, FollowersSidebar, StoryContainer, FollowedUserList

个人简介

我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易,
但坚持一定很酷。欢迎大家一起讨论











主目录

与歌谣一起通关前端面试题

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/404481.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java学习----方法的重载

一个类中有多个同名的参数不一样的方法。 作用:可以根据不同的条件调用不同的方法。 注意:java不会因为方法的返回类型或者权限的不同而判断为不同的两个方法。 public class Student {public Student() {System.out.println("Student构造方法1&quo…

[react] react的书写规范有哪些

[react] react的书写规范有哪些 React元素必须使用大驼峰命名的方式组件尽量命名,方便进行调试JSX尽量用小括号包起来,更加直观,防止换行时出错 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持…

LAMP源代码编译整理

在我们编译安装Apache 之前,要考虑的是让Apache 在什么样的模式下运行,因为从Apache 2.0 就加入了MPM(Multi-Processing Modules,多道处理模块)。Apache 2.0 在性能上的改善最吸引人。在支持POSIX 线程的Unix 系统上&a…

windows平台编译vlc

From: http://blog.csdn.net/guanshangming/article/details/5581270 转自:http://jeremiah.blog.51cto.com/539865/114190Jeremiah刚刚工作几个月,参与的第一个项目是与视频监控有关,分配给我的任务就是用开源的vlc做一个自己的播放器。对于开源项目来…

Appium--环境搭建

Appium介绍 Appium是一个移动端的自动化框架,可以做H5、Web测试、可以做功能测试(Android、IOS)、可以做跨进程测试,且是跨平台的。Appium做测试的时候支持的语言有很多种,包括java、Python、ruby、PHP、C#等。由于我熟…

[react] 类组件和函数式组件有什么区别?

[react] 类组件和函数式组件有什么区别? 函数式组件没有state和一系列的钩子函数,只接收一个props 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前…

Windows 系统下Git安装图解

From: http://blog.csdn.net/jiguanghoverli/article/details/7902791 Windows 系统下Git安装图解 简单来说Git是一个免费的、开源的版本控制软件,从功能上讲,跟我们比较熟悉的Subversion(SVN)这类版本控制软件没什么两样。由于工作的需求,需…

opencv 在debian6.0下安装

1.下载 OpenCV-2.3.1a.tar.bz2 http://sourceforge.net/projects/opencvlibrary/files/opencv-unix/2.3.1/ 2. 解压 tar -jxvf OpenCV-2.3.1a.tar.bz2 -C extract path 3 编译 安装 cmake -D CMAKE_BUILD_TYPERELEASE -D CMAKE_INSTALL_PREFIX/usr/local sourcecode/path 得到 …

GROUP BY 和SUBSTRING 的配合使用

GROUP BY 和SUBSTRING 的配合使用 也许你会遇到这样的数据情况: CREATE TABLE #PRODUCT(PRODUCTNAME NVARCHAR(50),STORAGE INT)INSERT INTO #PRODUCT VALUES(vancl裤子 白色,4)INSERT INTO #PRODUCT VALUES(vancl裤子 黑色,6)INSERT INTO #PRODUCT VALUES(vancl裤子…

[react] react中发起网络请求应该在哪个生命周期中进行?为什么?

[react] react中发起网络请求应该在哪个生命周期中进行?为什么? 异步情况可以在componentDidMount()函数中进行。 同步的情况可以在componentWillMount()中进行。 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易&#xff0…

【fedora12】vlc-2.0.0编译

From: http://www.zhouwenyi.com/node/1348 1. 官网下载 VLC 源码 (vlc- 2.0.0.tar.xz) 下载地址为: http://download.videolan.org/pub/videolan/vlc/2.0.0/vlc-2.0.0.tar.xz 2. 解压VLC源码: xz -dvlc-2.0.0.tar.xz tar -xvfvlc-2.0.0.tar 3. cdvlc-2.0.0 …

终于发现为什么SQL没有释放句柄,原来是保存句柄的变量被覆盖了,丢失了原来的句柄...

stmt xxx , stmt yyy , stmt.close() 之前的xxx 没有close掉转载于:https://www.cnblogs.com/studyNT/p/5063796.html

Android实现3D旋转效果

下面的示例是在Android中实现图片3D旋转的效果。实现3D效果一般使用OpenGL,但在Android平台下可以不直接使用OpenGL,而是使用Camera实现,Camera中原理最终还是使用OpenGL,不过使用Camera比较方便。 Camera类似一个摄像机&#xff…

[react] 请描述你对纯函数的理解?

[react] 请描述你对纯函数的理解? 给定了输入的参数,则函数抛出的数据就是确定的函数内没有副作用(定时器,ajax等) 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持一定很酷。欢迎大家一起讨论…

xsd操作

1.xsd介绍详见: http://blog.sina.com.cn/s/blog_ad0672d60102uy6w.html2.生成xsdDataSet dataSet new DataDet();// read date from xml filedataSet.ReadXml("xml2.xml", XmlReadMode.ReadSchema);// .. or set data with code// save as xsd fileSystem.IO.Strea…

[react] 在react中无状态组件有什么运用场景

[react] 在react中无状态组件有什么运用场景 适用于逻辑简单的纯展示的场景,如资料卡片等 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前端面试题

想尽快进入游戏开发行业的必经之路!

From: http://blog.csdn.net/hsz8250/article/details/639771 小时候就梦想自己以后能够参与游戏的制作,自己开发出来的游戏是最受欢迎,但是成功的背后充满了泪水和努力,只看表面是永远不会成功的.假如你对游戏开发充满热情,以下有一条最快的道路,让你尽快进入游戏开发行业,让…

搭建hadoop开发环境--基于xp+cygwin

2019独角兽企业重金招聘Python工程师标准>>> 1.安装cygwin 参考博文:http://hi.baidu.com/%BD%AB%D6%AE%B7%E7_%BE%B2%D6%AE%D4%A8/blog/item/8832551c7598551f314e15c2.html Q1.实际安装中在第9步 “打开cygwin进行配置,首先输入&#xff…

random---伪随机数生成器

python3.5 作用:实现了多种类型的伪随机数生成器 random模块基于Mersenne Twister 算法提供了一个快速伪随机数生成器。原先开发这个生成器是为了向蒙特卡洛模拟生成输入,Mersenne Twister算法会生成有一个大周期的近均匀分布的数,以适用于各…

[react] 写一个react的高阶组件并说明你对高阶组件的理解

[react] 写一个react的高阶组件并说明你对高阶组件的理解 定义高阶组件 import React, { Component } from react;const simpleHoc WrappedComponent > { console.log(simpleHoc); return class extends Component { render() { return <WrappedComponent {...this.…