<template> <component :is="myComponent" ref="detail" /> </template> <script> import { mapGetters } from 'vuex' import GroupFeedingEfficiency from './group' import PastureFeedingEfficiency from './pasture' export default { name: 'FeedingEfficiency', components: { GroupFeedingEfficiency, PastureFeedingEfficiency }, data() { return { myComponent: null } }, computed: { ...mapGetters(['ispastureuse']) }, mounted() { this.detailComponent() }, methods: { detailComponent() { if (this.ispastureuse == 0) { const vue = this var myComponent = () => import('./pasture/index.vue') return vue.myComponent = myComponent } else { const vue = this var myComponent = () => import('./group/index.vue') return vue.myComponent = myComponent } } } } </script>