<react> 组件的详细介绍：

<react> 组件的详细介绍：

思维导图：

代码介绍：

TodoList:(组件)

import React, { Component } from 'react'
import Style from  './style.css'

export default class index extends Component {
    render() {
        return (
            <div>
                <h2>TodoList</h2>
        m
            </div>
        )
    }
}

Todoinput ：（组件）

import React, { Component } from 'react'
import  Style  from './style.css'

export default class index extends Component {
    render() {
        return (
            <div>
                <h2>Todoinput</h2>
                
            </div>
        )
    }
}

Header:(组件)

import React, { Component } from 'react'
import Title from './Title'
import Style from './style.css'
export default class index extends Component {
    render() {
        return (
            <div>
                <h2>Header</h2>
                 <Title/> 
            </div>
        )
    }
}

Title:(组件)

import React, { Component } from 'react'

export default class Title extends Component {
    render() {
        return (
            <div>
                <h3>Title</h3>
         </div>
        )
    }
}

Component 里面的index.js ：（抛出去）

// import TodoList from './TodoList'
// import Header from './Header'
// import Todoinput from './Todoinput
// export{
//     TodoList,
//     Header,
//    Todoinput
// }
-------------------------------------------------
export {default as TodoList} from './TodoList'
export {default as Header} from './Header'
export {default as Todoinput} from './Todoinput'
-------------------------------------------------------
两种方法都可以
（把Component 里面的组件全部抛出去）

App.js:（组件）

/* eslint-disable no-unused-vars */
import React, { Component,Fragment } from 'react'
import{
  TodoList,
  Header,
 7 }from './Component'
import Title from './Component/Header/Title';

export default class App extends Component {
  render() {
    return (
        <Fragment >
        <TodoList/>
        <Header/>
        <Todoinput/>
        </Fragment >
        // {/* // <> */}
        // {/* // </> */}
    )
  }
}

index.js:（组件）

import React from "react";
import ReactDOM from "react-dom";
import App from './App'

ReactDOM.render(<App />, document.getElementById("root"));