React组件介绍

React组件允许你将 UI 拆分为独立可复用的代码片段，并对每个片段进行独立构思。

组件，从概念上类似于 JavaScript 函数。它接受任意的入参（即 “props”），并返回用于描述页面展示内容的 React 元素。

函数组件

定义组件最简单的方式就是编写 JavaScript 函数：

function Welcome(props) {   return <h1>Hello, {props.name}</h1>; }

该函数是一个有效的 React 组件，因为它接收唯一带有数据的 “props”（代表属性）对象与并返回一个 React 元素。

这类组件被称为“函数组件”，因为它本质上就是 JavaScript 函数。

该函数在React中是一个有效的组件，可以接收唯一带有数据的props(代表属性)对象，并返回一个React元素。函数式组件要特别注意，组件名称首字母一定要大写。这种方式也成为无状态组件。

　　特点有：

　　1.组件不会被实例化，整体渲染性能提升了。没有实例化，就不需要分配多余的内存。

　　2.不能访问this对象，像this.ref , this.state等不能访问

　　3.组件无法访问生命周期方法

class 组件

更加简洁方便，this指向该组件，可以访问到生命周期函数。数据可通过this.setState()方法进行修改。

渲染组件

组合组件

提取组件

来千语创想移动应用开发平台学习更多APP开发知识：app开发，app制作，app开发源码下载，app开发框架，app制作模板等免费获取。

千语创想-专业APP开发、app定制服务商，提供一站式移动应用解决方案，满足您的各类需求，欢迎免费评估需求和获取报价。

立即免费在线制作一个APP，新手注册即送开发大礼包