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 ...
随机推荐
- h5 定位
<!DOCTYPE html> <html> <body> <p id="demo">点击这个按钮,获得您的坐标:</p> ...
- python-切片实例
针对list或tuple取指定范围的操作.可以使用切片(slice),非常有用 1.list:可变数组 L=['a','b','c','d','e'] >>> L[0:3] #从第0 ...
- VUE系列三:实现跨域请求(fetch/axios/proxytable)
1. 在 config/index.js 配置文件中配置proxyTable 'use strict' // Template version: 1.3.1 // see http://vuejs-t ...
- Unity-------------------------关于GUI绘制的编程
转载:在这篇文章中我将给读者介绍Unity中的图形用户界面(GUI)编程.Unity有一个非常强大的GUI脚本API.它允许你使用脚本快速创建简单的菜单和GUI. 简介 Unity提供了使用脚本创建G ...
- Redis集群的操作
1.原始集群 1.1 启动Redis集群 [root@cent03 ~]# /usr/local/redis/bin/redis-server /usr/local/redis-cluster/ ...
- window wlan 相关服务
1.Extensible authentication protocol 2.cng key lsolation 3.wlan autoconfig
- MySQL谨慎使用"replace into"
From: http://blog.xupeng.me/2013/10/11/mysql-replace-into-trap/ MySQL 对 SQL 有很多扩展,有些用起来很方便,但有一些被误用之后 ...
- Oracle 一个中文汉字 占用几个字节,由Oracle中字符集编码决定
Oracle 一个中文汉字 占用几个字节,要根据Oracle中字符集编码决定 查看oracle server端字符集 select userenv('language') from dual; 如果显 ...
- js scrollIntoViewIfNeeded
根据 MDN的描述,Element.scrollIntoView()方法让当前的元素滚动到浏览器窗口的可视区域内. 而Element.scrollIntoViewIfNeeded()方法也是用来将不在 ...
- js 事件详解 冒泡
起因:正常情况下我点击s2时是先弹出我是children,再弹出我是father,但是却出现了先弹出我是father,后弹出我是children的情况,这种情况是在和安卓app交互的h5页面中出现的, ...