tabs頁面
<template>
? ? <div class="app-container">
? ? ? ? <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
? ? ? ? ? ? <el-tab-pane label="套餐用戶列表" name="first">
? ? ? ? ? ? ? ? <user-list ref="userList"/>
? ? ? ? ? ? </el-tab-pane>
? ? ? ? ? ? <el-tab-pane label="套餐種類" name="two">套餐種類</el-tab-pane>
? ? ? ? ? ? <el-tab-pane label="套餐配置" name="three">套餐配置</el-tab-pane>
? ? ? ? </el-tabs>
? ? </div>
? </template>
? <script>
? import userList from "../setMeal/userList";
? export default {
? ? name: "SetMeal",
? ? components: {
? ? ? ? userList
? ? },
? ? data() {
? ? ? return {
? ? ? ? activeName: 'first'
? ? ? };
? ? },
? ? created() {
? ? },
? ? methods: {
? ? ? ? handleClick(tab, event) {
? ? ? ? ? ? console.log(tab, event);
? ? ? ? }
? ? }
? };
? </script>
引入的頁面
<template>
? ? <div class="app-container">
? ? ?
? ? </div>
? </template>
? <script>
? export default {
? ? name: "UserList",
? ? data() {
? ? ? return {
? ? ? };
? ? },
? ? created() {
? ? },
? ? methods: {
? ? ? ?
? ? }
? };
? </script>