React逐层传递数据的方法

import React, { Component } from 'react';

class Second extends Component {
  render() {
    return (
      <div>
        { this.props.theme } - { this.props.color}
      </div>
    )
  }
}
const First = (props) => {
  return (
    <div>
      <Second theme = {props.theme} color = { props.color }/>
    </div>
  )
}
// 子组件给父组件传值 实际上也是父组件给子组件传值
// 父传给子一个函数 该函数由父组件设定，由子组件调用 调用时传递的参数其实就是子组件传递给父组件的值
export default class App extends Component {
  state = {
    theme:'dark',
    color:'red'
  }
  render() {
    return (
      <div>
        <First theme = { this.state.theme} color = { this.state.color}/>
      </div>
    );
  }
}