Vue 根據(jù)條件判斷van-tab的顯示方式
更新時間：2020年08月03日 09:24:04 作者：勛勛勛勛小勛勛
這篇文章主要介紹了Vue 根據(jù)條件判斷van-tab的顯示方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
我就廢話不多說了，大家還是直接看代碼吧~
.vue
<van-tabs v-model="activeTab">
<van-tab title="XXX" v-if="isShow"></van-tab>
<van-tab title="XXX"></van-tab>
</van-tabs>
.ts
private activeTab = 0;
private isShow = false;
補充知識：vue elui 使用v-if 判斷tab時樣式錯亂
項目中用el ui 的tab顯示數(shù)據(jù)
6個數(shù)組的數(shù)據(jù)不同 所以用了 v-if 來判斷
但是同樣的數(shù)據(jù)，顯示出來的樣式亂七八糟
查了半天才知道 是因為沒有加上 key值，所以才會渲染錯亂。具體原因也不知道。
只要在table 加上key 就可以了
<el-table v-if="personalType=='publicNumber'" :data="publicNumberArray" key="publicNumber" >
vue的循環(huán)也是，如果不加上 絕對不同的key 可能就會出 .length 錯誤或者 一些簡單的數(shù)組錯誤
還不放心，也可以給key加一個 隨機數(shù) 就可以了
key="Math.random()"
以上這篇Vue 根據(jù)條件判斷van-tab的顯示方式就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
安裝vue無法運行、此系統(tǒng)無法運行腳本問題及解決
這篇文章主要介紹了安裝vue無法運行、此系統(tǒng)無法運行腳本問題及解決,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
vue3+vite+axios?配置連接后端調用接口的實現(xiàn)方法
這篇文章主要介紹了vue3+vite+axios?配置連接后端調用接口的實現(xiàn)方法，在vite.config.ts文件中添加配置，本文通過實例代碼給大家介紹的非常詳細,需要的朋友可以參考下2022-12-12
這篇文章主要介紹了vue?實現(xiàn)手動分割日期，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要介紹了Vue3設置Proxy代理解決跨域問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05
這篇文章給大家詳細的整理了Vue中實現(xiàn)路由跳轉的三種方式,使用vue-router,聲明式-router-link,編程式這三種方法,分別有詳細的代碼示例,需要的朋友可以參考下2023-09-09
解決vue動態(tài)為數(shù)據(jù)添加新屬性遇到的問題
今天小編就為大家分享一篇解決vue動態(tài)為數(shù)據(jù)添加新屬性遇到的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
vue.config.js?是一個可選的配置文件,如果項目的?(和?package.json?同級的)?根目錄中存在這個文件,那么它會被?@vue/cli-service?自動加載,這篇文章主要介紹了vue項目中vue.config.js文件的介紹,需要的朋友可以參考下2024-02-02
在vue中，使用watch來響應數(shù)據(jù)的變化。watch的用法大致有三種。下面代碼是watch的一種簡單的用法，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友參考下吧2018-11-11
組件是可以在它們自己的模板中調用自身的,不過它們只能通過?name?選項來做這件事,下面這篇文章主要給大家介紹了關于Vue組件化開發(fā)的必備技能之組件遞歸的相關資料,需要的朋友可以參考下2022-01-01
這篇文章主要介紹了vue中button標簽樣式和功能禁用的寫法，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04