12345678910111213141516171819202122232425262728293031323334353637383940414243444546 |
- <template>
- <div class="app-container">
- <el-tabs v-model="activeName" @tab-click="handleClick">
- <el-tab-pane label="集团信息" name="first">
- <component :is="myComponent1" ref="detail" />
- </el-tab-pane>
- <el-tab-pane label="牧场" name="second">
- <component :is="myComponent2" ref="detail" />
- </el-tab-pane>
- </el-tabs>
- </div>
- </template>
- <script>
- export default {
- name: 'OperationManagement',
- data() {
- return {
- activeName: 'first',
- myComponent1: null,
- myComponent2: null
- }
- },
- mounted() {
- this.detailComponent()
- },
- methods: {
- detailComponent() {
- const vue = this
- var myComponent1 = () => import('./group/index.vue')
- return vue.myComponent1 = myComponent1
- },
- handleClick(item) {
- if (item == 'first') {
- const vue = this
- var myComponent1 = () => import('./group/index.vue')
- return vue.myComponent1 = myComponent1
- } else {
- const vue = this
- var myComponent2 = () => import('./pasture/index.vue')
- return vue.myComponent2 = myComponent2
- }
- }
- }
- }
- </script>
|