【React】React组件介绍 和 创建组件的两种方式

一. 组件介绍

组件是React的一等公民 ， 使用Reac就是在使用组件

组件表示页面中部分

组合多个组件实现完整的页面功能

特点: 可复用 独立 可组合

二. 创建组件的两种方式

介绍: 一共两种分别 函数创建组件 与 class创建组件

（1）函数创建组件

语法：

//普通函数
function Ceract () {
   return <h1>我是一个函数组件！</h1>
 }

// 箭头函数
const Ceract = () => <h1>我是一个函数组件！</h1>

函数组件: 使用JS的函数创建组件 

约定1：函数的名称必须是大写字母开头

约定2：函数名称必须有返回值 表示该组件的结构

扫描二维码关注公众号，回复： 14742466 查看本文章

如果返回值为null 表示不渲染任何内容

使用函数名作为标签名

（2）class创建组件

语法：

class Create extends React.Component {
  render () {
    return <h1>我是使用类创建的组件</h1>
  }
}

描述: 

约定1: 类名称必须是大写字母开头

约定2:类组件应该继承 React.Component父类，从而可以使用父类中提供的方法或者属性

约定3:类组件必须提供render方法

约定4: render方法内必须有 return 返回值 ，表示组件结构