微信截圖_20180310142617.png
在vue中猪狈，我們使用slot分發(fā)，來完成可組合組件辩恼，類似一個組件中有多個插槽雇庙，需要用哪些功能谓形，就插入需要的功能。
在React叫做可組合組件疆前，那么在React中如何實現(xiàn)寒跳？
1.需要在組件中，將props中的值出來解構(gòu)出來竹椒。
//這兩者作用完全等價
const { children, tabNameLeft, tabNameRight } = this.props;//es6解構(gòu)語法
2.在組件中童太，需要改變的地方加上{children}
{children}
<NavUl>
<div>{tabNameLeft}</div>
<div>{tabNameRight}</div>
</NavUl>
組件代碼：
public render() {
const { children, tabNameLeft, tabNameRight } = this.props;
return (
{children}
<NavUl>
{tabNameLeft !== "" &&
<NavLi>
<NavLiDiv>
<Link to="/digital-museum" style={
this.tabStyle
}>{tabNameLeft}</Link>
</NavLiDiv>
</NavLi>}
{tabNameRight !== "" &&
<NavLi>
<NavLiDiv>
<Link to="/quaternity" style={
this.tabStyle
}>{tabNameRight}</Link>
</NavLiDiv>
</NavLi>
}
</NavUl>
)
}
3.使用組件的地方，將你需要傳入的值傳進(jìn)你定義好的參數(shù)即可實現(xiàn)slot
<Header tabNameLeft={"A"} tabNameRight={""} ></Header>
