React Native(六)——PureComponent VS Component
先看两段代码:
export class ywg extends PureComponent {
……
render() {
return (
……
);
}
}
export class ywg extends Component {
……
render() {
return (
……
);
}
}
PureComponent VS Component
Stateless components may also be referred to as Pure Components, or even Dumb Components, and are meant to represent any React Component declared as a function that has no state and returns the same markup given the same props.
These types of components surprisingly compose a large majority of our applications and, as a result, React 0.14 introduces the ability to write these stateless components as functions, also known as functional stateless components.
So these are some of the UI elements that I summarize from Tencent work.
无状态的组件又被叫做“纯粹的组件”,甚至是“哑巴组件”。这是指这样的一些组件:React组件中有一些被声明为函数(而不是继承自Component的class),它们没有state
,只要给定同样的props
,就会返回同样的标签块。这种类型的组件出人意料的成为构建大型应用程序的常用方法,所以,自从React 0.14开始支持使用函数的方式来创建这种无状态组件,所以也被叫做“函数式无状态组件”。无状态组件渲染效率更高,编写和组合更加简单。
在RN项目中,无论你使用这两者中的哪一种,都无可厚非,关键就是自己在使用时权衡利弊或者是跟团队保持一致就好。
React Native(六)——PureComponent VS Component的更多相关文章
- [React Native] Using the WebView component
We can access web pages in our React Native application using the WebView component. We will connect ...
- [React Native] Using the Image component and reusable styles
Let's take a look at the basics of using React Native's Image component, as well as adding some reus ...
- [React Native] Use the SafeAreaView Component in React Native for iPhone X Compatibility
In this lesson, you will learn how to use the SafeAreaView component to avoid the sensor cluster (th ...
- [react native] react-native-tab-navigator在子Component中隐藏
因为文档只列出了TabBarIOS, 不支持Android,所以github上找到这个组件. 先说下我的页面构造: 入口文件 —> 注册组件(包含Navigator, 跳转到欢迎页)—> ...
- [React Native] Build a Separator UI component
In this lesson we'll create a reusable React Native separator component which manages it's own style ...
- [React Native] Create a component using ScrollView
To show a list of unchanging data in React Native you can use the scroll view component. In this les ...
- React Native 系列(六) -- PropTypes
前言 本系列是基于React Native版本号0.44.3写的.在我们之前的通过props实现组件间传值的时候,大家有没有发现在父组件传递值过去,在子控件获取props的时候没有提示,那么如何能实现 ...
- React Native 系列(六)
前言 本系列是基于React Native版本号0.44.3写的.在我们之前的通过props实现组件间传值的时候,大家有没有发现在父组件传递值过去,在子控件获取props的时候没有提示,那么如何能实现 ...
- [React] Use React.memo with a Function Component to get PureComponent Behavior
A new Higher Order Component (HOC) was recently released in React v16.6.0 called React.memo. This be ...
随机推荐
- 关于Unity3D中鼠标移动指定物体的解决方案
一.鼠标拾取物体的原理 在Unity3D当中,想要在观察面(Aspect)中拾取物体(有碰撞属性)的方法一般如下: 1.声明一个观察的摄像机.一个从摄像机原点出发的射线Ray以及一个用于检测碰撞的Ra ...
- shell编程小结
因为项目中要用到shell脚本,所以系统的看了一下.以前只是泛泛的了解. 变量:环境变量.预定义变量.位置变量.自定义变量. 环境变量这个好说,通过set或者env命令都能看到相应的列表,然后可以通过 ...
- Python——eventlet.greenthread
该模块实现 eventlet 中的 “绿色线程” 即协程. 相关的 greenlet 模块的介绍. 目录 一.模块级函数 sleep() spawn() 模块级函数 eventlet.greenthr ...
- perl 查看某个模块的安装路径
perldoc 命令可以查看某个模块的安装路径 命令: perldoc -l Bio::Seq 返回值如下: /usr/local/share/perl5/Bio/Seq.pm
- 纯js实现最简单的文件上传(后台使用MultipartFile)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 阿里云centos7安装桌面环境
centos7. 1.安装X11.yum groupinstall "X Window System". 2.安装gnome. 全安装:yum groupinstall -y &q ...
- 查看cp进度,使用watch
watch -n 1 -d du -sh dir 每隔1s查看当前目录所占空间大小
- Genymotion模拟器无法开启的解决方法——Unable to start the virtual device,The virtual device got no IP address
前言 最近重装了电脑的系统,由win7换成了win8.1.android开发环境也重新配置了一遍.其他的都还好,就是genymotion模拟器一直开启失败. 自己尝试了很多方法,比如卸载重装软件,重新 ...
- Android学习之——实现圆角Button
在drawable文件夹下新建btn_shape.xml文件: <?xml version="1.0" encoding="utf-8"?> < ...
- cp -rf 提示覆盖解决办法
cp覆盖时,无论加什么参数-f之类的还是提示是否覆盖,当文件比较少的时候还可以按Y确认,当很多文件的时候就不好说了 方法一:vi ~/.bashrc # .bashrc # User specific ...