瀟湘沐
2018-10-12 22:25:45
<el-tab-pane v-for="(item, index) in systemOptionsHeaderList" :key="index" :name="item.value" :lazy="true"> <span slot="label" > {{item.label}} <tips v-if="formHasModify" content="本頁數(shù)據(jù)暫未保存" /> </span></el-tab-pane>使用了 element-ui 中的 tab-pane希望在 label 內(nèi)添加一個(gè)小組件,組件邏輯檢查過,沒問題這里使用v-if 控制組件的顯示和隱藏問題就是: 當(dāng) formHasModify 內(nèi)容改變之后,無法立即渲染出這個(gè)小組件需要 當(dāng)點(diǎn)擊 或者 切換 tab-pane 才能夠手動(dòng)的渲染出來
3 回答

米脂
TA貢獻(xiàn)1836條經(jīng)驗(yàn) 獲得超3個(gè)贊
<el-tab-pane
ref="elTabs"
v-for="(item, index) in systemOptionsHeaderList"
:key="index"
:name="item.value"
:lazy="true"
>
// 在控制變量改變的時(shí)候進(jìn)行 強(qiáng)制渲染更新
let childrenRefs = this.$refs.elTabs.$children
this.$nextTick(() => {
childrenRefs.forEach(child => child.$forceUpdate())
})

肥皂起泡泡
TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超6個(gè)贊
這個(gè)具體也不好說,個(gè)人的理解是因?yàn)槟愕臄?shù)據(jù)是循環(huán)出來的,數(shù)據(jù)量大,你使用v-if等同于將代碼刪除了,所以即使你狀態(tài)改變了,這段代碼依然沒有渲染出來,建議你用v-show試試
添加回答
舉報(bào)
0/150
提交
取消