其他分享
首页 > 其他分享> > tab

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