react中类似vue的插槽this.props.children的用法

父组件

 <TestHanderClick bg="blue">
        <p> 如果我要显示的话，父组件是双标签，子组件中有this.props.children</p>
        <div>类似于匿名插槽</div>
  </TestHanderClick>

子组件

import React, { Component } from "react";
import "./base.css"


// 父组件
export class TestHanderClick extends Component {
  //  static defaultProps是默认的写法，人家规定这样写的，你的默认值
  static defaultProps={
    bg:"pink",
    wi:"400px",
    he:"200px"
  }

  render() {
    return (
      // 使用值
      <div style={{  background: this.props.bg, width: this.props.wi,  height:this.props.he  }}>
        123
        {this.props.children}
         //通过这个组件，可以获取父组件中的数据
      </div>
    )
  }
}

export default TestHanderClick;