react-插槽

在React中也有插槽技术

类似普通的HTML双标签,React组件也可以写成双标签的形式，并在标签之间插入内容

class Demo extends React.Component {
              render(){
                     return <div>

                                 <Child>
                                             <li>列表1</li>
                                             <li>列表2</li>
                                 </Child>
                               </div>

}



}



class Child extends React.Component {
              render(){
                      return <lul>
                                    {this.props.children}
                                 </ul>
}
}    

与普通标签不同的是，标签之间的内容并不能直接展示在页面上，需要在子组件里面在props.Children属性上访问，这样就可以将里面的内容在自己想要的地方按照自己想要的顺序展示（Children是一个数组，可以按照下标进行访问）