tab切换组件页面使用 :is属性
父组件
<template><div class=""><t-tabsv-model="value"@change="tabChangeClick"><t-tab-panelv-for="(panel, index) in panels"v-bind="panel":key="index"><!-- 此处切换tab, datas是父子组件通信 --><component:is="currentView":datas="data"></component></t-tab-panel></t-tabs></div></template><script>import tab1 from "./Tab1";import tab2 from "./Tab2";export default {name: "",data() {return {data: [],panels: [{name: "tab1", label: "tab-1" },{name: "tab2", label: "tab-2" },],value: "tab1",tab1: "tab1",tab2: "tab2",currentView: "tab1",};},components: {tab1,tab2},methods: {tabChangeClick($event) {this.currentView = $event;},},};</script><style lang=''></style>
子组件
Tab1和Tab2 路径结构 Tab1/index.vue，Tab2/index.vue
父组件数据传递给子组件 使用 props
