我就廢話不多說了，大家還是直接看代碼吧~

.vue

<van-tabs v-model='activeTab'> <van-tab v-if='isShow'></van-tab> <van-tab></van-tab></van-tabs>

.ts

private activeTab = 0;

private isShow = false;

補充知識：vue elui 使用v-if 判斷tab時樣式錯亂

項目中用el ui 的tab顯示數據

6個數組的數據不同 所以用了 v-if 來判斷

但是同樣的數據，顯示出來的樣式亂七八糟

查了半天才知道 是因為沒有加上 key值，所以才會渲染錯亂。具體原因也不知道。

只要在table 加上key 就可以了

<el-table v-if='personalType==’publicNumber’' :data='publicNumberArray' key='publicNumber' >

vue的循環(huán)也是，如果不加上 絕對不同的key 可能就會出 .length 錯誤或者 一些簡單的數組錯誤

還不放心，也可以給key加一個 隨機數 就可以了

key='Math.random()'

以上這篇Vue 根據條件判斷van-tab的顯示方式就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持好吧啦網。