Vue 根据条件判断van-tab的显示方式

 更新时间:2020年08月03日 09:24:04   作者:勋勋勋勋小勋勋  
这篇文章主要介绍了Vue 根据条件判断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显示数据

6个数组的数据不同 所以用了 v-if 来判断

但是同样的数据,显示出来的样式乱七八糟

查了半天才知道 是因为没有加上 key值,所以才会渲染错乱。具体原因也不知道。

只要在table 加上key 就可以了

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

vue的循环也是,如果不加上 绝对不同的key 可能就会出 .length 错误或者 一些简单的数组错误

还不放心,也可以给key加一个 随机数 就可以了

key="Math.random()"

以上这篇Vue 根据条件判断van-tab的显示方式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • vue动画打包后失效问题的解决方法

    vue动画打包后失效问题的解决方法

    这篇文章主要介绍了vue动画打包后失效问题的解决方法,在文中给大家提到了vue-cli 打包后自定义动画未执行的解决方法,需要的朋友可以参考下
    2018-09-09
  • Vue 组件注册全解析

    Vue 组件注册全解析

    这篇文章主要介绍了Vue 组件注册全解析的相关资料,帮助大家更好的理解和使用vue,感兴趣的朋友可以了解下
    2020-12-12
  • Vue2.0/3.0双向数据绑定的实现原理详解

    Vue2.0/3.0双向数据绑定的实现原理详解

    这篇文章主要给大家介绍了关于Vue2.0/3.0双向数据绑定的实现原理,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-04-04
  • 解决vue组件中click事件失效的问题

    解决vue组件中click事件失效的问题

    今天小编就为大家分享一篇解决vue组件中click事件失效的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11
  • vue实现购物车加减

    vue实现购物车加减

    这篇文章主要为大家详细介绍了vue实现购物车加减,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-05-05
  • vue使用laydate时间插件的方法

    vue使用laydate时间插件的方法

    这篇文章主要为大家详细介绍了vue使用laydate时间插件的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-11-11
  • 详解Vue数据驱动原理

    详解Vue数据驱动原理

    这篇文章主要介绍了详解Vue数据驱动原理的相关资料,帮助大家更好的理解和学习vue框架的相关知识,感兴趣的朋友可以了解下
    2020-11-11
  • vue移动端实现手机左右滑动入场动画

    vue移动端实现手机左右滑动入场动画

    这篇文章主要为大家详细介绍了vue移动端实现手机左右滑动入场动画,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-08-08
  • 一个例子轻松学会Vue.js

    一个例子轻松学会Vue.js

    这篇文章主要为大家详细介绍了一个例子,帮助大轻松学会Vue.js,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • vue.js源代码core scedule.js学习笔记

    vue.js源代码core scedule.js学习笔记

    这篇文章主要为大家详细介绍了vue.js源代码core scedule.js的学习笔记,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07

最新评论