（React）组件

前言

为了提高代码的重用性，组件化是开发中必不可少的；
而React也为我们实现组件化，提供了很好的条件；

Class组件

• 声明组件

import React, { Component } from 'react'
import './App.css';
// 声明组件App，继承自Component
class App extends Component {
  render() {
    return (
      <div className="App">
        React
      </div>
    );
  }
}
export default App;

• 使用组件

import App from './App';
ReactDOM.render(
   // 把组件当一个普通的标签使用
  <App></App>,
  document.getElementById('root')
);

函数组件

• 声明组件

import "./App.css";
// 直接声明一个函数，函数的名称就是组件的名称
function App() {
  return <div className="App">React2</div>;
}
export default App;

• 使用组件

import App from './App';
ReactDOM.render(
   // 把组件当一个普通的标签使用
  <App></App>,
  document.getElementById('root')
);

两种组件的使用方式是一样的。