学习React(5) - 组件 Component

组件是用来描述一部分的用户界面。
组件是可以重复利用的，而且还可以嵌套在其他组件中。

组件类型：
（1）无状态功能组件 Stateless Functional Component

采用JavaScript Functions

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

那么在App.js 文件中，应该如何写呢：

import React from 'react';
import './App.css';

class App(){
     return (
         <div className="App">
            <h1>Hello World</h1>
         </div>
     );
}

export default App;

（2）有状态组件类 Stateful Class Component

采用Class extending Component class, render method returning HTML

class Welcome extends React.Component {
   render() {
      return <h1>Hello, {this.props.name}</h1>;
   } 
}

那么在App.js 文件中，应该如何写呢：

import React, { Component } from 'react';
import './App.css';

class App extends Component {
   render() {
     return (
           <div className="App">
             <h1>Hello World</h1>
            </div>
          );
   }
}

export default App;

如果觉得总结不错的话，给个赞呗！