标签：style bar 选择 eth value 信用卡 sele code methods
卡了好半天才弄出来，记录一下吧！
首先默认写法没有写怎么进行路由跳转，看了看文档有这种展开的还算眼熟，就拿它开刀了
<cube-tab-bar v-model="selectedLabel" show-slider> <cube-tab v-for="(item, index) in tabs" :icon="item.icon" :label="item.label" :key="item.label"> </cube-tab> </cube-tab-bar>
官方文档中说：用于 cube-tab-bar 渲染的数据，数组的每一项是一个 Object 类型，包括 label、icon 和 value（默认值等于 label）1.12.5+，如果使用自定义插槽，可不传此值
所以，当我给父元素一个change事件的时候，每回打印的都是label中的值，当我们需要路由跳转，只需要在data中添加path字段，将value动态绑定path就可以获取到path的值，这样我们就可以实现跳转了。
<cube-tab-bar v-model="selectedLabelDefault" @click="changeHandler"> <cube-tab v-for="item in tabs" :icon="item.icon" :label="item.label" :value="item.path" :key="item.path"> </cube-tab>
data () { return { selectedLabelDefault: ‘/‘, //这个是默认选择的值，当value绑定的是path时，这里也需要写成path tabs: [{ label: ‘首页‘, icon: ‘cubeic-home‘, path: ‘/‘ }, { label: ‘投资‘, icon: ‘cubeic-like‘, path: ‘/investment‘ }, { label: ‘信用卡‘, icon: ‘cubeic-vip‘, path: ‘/card‘ }, { label: ‘生活‘, icon: ‘cubeic-person‘, path: ‘/life‘ }, { label: ‘我的‘, icon: ‘cubeic-person‘, path: ‘/user‘ }] } }, methods: { changeHandler (path) { // if you clicked different tab, this methods can be emitted this.$router.push(path) } }
标签：style bar 选择 eth value 信用卡 sele code methods
原文地址：https://www.cnblogs.com/zySun622/p/11800342.html
