vant--------tab touch

今天小生主要讲的是自己在平时项目中用的最常见的几种功能，也是前端开发最需要的：

demo实例https://download.csdn.net/download/zxd1314520/10634016

1.tab选项卡是平时项目中最大众的一个，有时候根据业务需要加上touch效果

vant再简单适宜了。

首先基于依赖install

我们需要安装vant 安装方法可见我的浅谈vue.js 从配置环境到打包运行 （初学者适应），在main.js引入

import 'vant/lib/vant-css/index.css'

import { Tab, Tabs } from 'vant';

Vue.use(Tab).use(Tabs);

用法 列子

html:

 

<van-tabs v-model="active" swipeable>
            <van-tab v-for="(item,index) in navArr" :title="item.name" class="v-tab">
                <div v-if="index==0">
                    我是第一个
                </div>
                <div v-if="index==1">我是二个</div>
                <div v-if="index==2">我是第三个</div>
            </van-tab>

 </van-tabs>

 

 

js:

export default {