一個選項卡，分別三項內容，我把三項內容分為三個組件，另外配置一個高階組件用于邏輯加載組件，如圖:三個li里分別是選項列表，外部引入內容組件，Compon是引入的內容組件分別有三個，我想問的是在高階組件中，怎樣去加載引入的不同組件呢？ 就在code-loaderBox里,我的想法是建立一個屬性，然后通過點擊li時的邏輯 把組件賦給這個屬性，最后在div中只寫那個屬性就ok了，請問這種方法可行嗎？或者說有沒有更簡便的方式;
2 回答
守候你守候我
TA貢獻1802條經驗 獲得超10個贊
最簡單最直接的辦法，利用一個條件來決定是否渲染組件,通過更改這個條件來實現切換局部組件的渲染與取消。
偽代碼：
let com;if(true){
com=<Component/>}else{
com=null}
使用
{com}算是最簡單的辦法了吧
富國滬深
TA貢獻1790條經驗 獲得超9個贊
謝邀~
首先我沒太讀懂你是想做什么, 我的理解是當你點擊li, 切換下方的code-loaderBox去顯示不同的組件?
其次, 看到你的代碼我提幾個意見, 僅供參考.
不使用jquery, 用state去保存狀態
li可以使用一個數組對象去封裝好參數, 這樣傳參也比較方便, render之前可以動態生成一個list
const list;
list = 數組.map(function(o, i, objs){
return <li onclick={this.onClick(i))} key={i} >{o.name}</li>
});return中
<ul>
{list}
</ul>onClick中
onClick(i){
//傳入的參數, 可以為任意含義的參數, 但必須唯一
//根據不同情況去
var status = 某種情況;
this.setState({status: status});
}code-loaderBox中動態顯示某些組件
<div> this.state.status == 某種情況 ? <某種情況下的組件 /> : null this.state.status == 某種情況 ? <某種情況下的組件 /> : null this.state.status == 某種情況 ? <某種情況下的組件 /> : null ... //多個的話也可以寫一個switch </div>
添加回答
舉報
0/150
提交
取消