React 将 state 传给子组件用

index.js

import React from 'react'
import ReactDOM from 'react-dom'

function Name({ name }) {
  return <span style={{ color: 'tomato' }}>{name}</span>
}

function Age({ age }) {
  return <span style={{ color: 'orange' }}>{age}</span>
}
class Title extends React.Component {
  constructor() {
    super()
    this.state = {
      name: 'Lilei',
      age: 23,
    }
  }
  render() {
    return (
      <h1>
        <Name name={this.state.name} /> | <Age age={this.state.age} />
      </h1>
    )
  }
}

ReactDOM.render(<Title />, document.getElementById('root'))