tab
作者:互联网
<Tabs :value="currentTab" @on-click="changeTab" style="background-color: white" v-if="menuList.length">
<TabPane v-for="(item, index) in menuList" :key="index" :label="item.name" :name="item.routeName"></TabPane>
</Tabs>
<component :is="currentView" v-if="currentView"></component>
import Activity from './activity-conf.vue';
import Target from './target-configuration/index.vue';
export default {
components: { Activity, Target },
data() {
return {
menuList: [
{
name: '目标配置', // 目标配置
routeName: 'passenger-flow-target',
accessKey: 'CUSTOMER_TARGET_CONFIGURATION',
},
{
name: '活动配置', // 活动配置
routeName: 'passenger-flow-event',
accessKey: 'CUSTOMER_EVENT_CONFIGURATION',
},
],
currentView: '',
currentTab: '',
}
}
created(){
this.menuList[0] && this.changeTab(this.menuList[0].routeName);
}
methods:{
changeTab(item) {
this.currentTab = item;
switch (item) {
case 'passenger-flow-target':
this.currentView = 'Target';
break;
case 'passenger-flow-event':
this.currentView = 'Activity';
break;
}
},
}
}
标签:passenger,currentView,Target,flow,routeName,tab,Activity 来源: https://blog.csdn.net/weixin_43843679/article/details/116587723