<template>
<div>
<!-- <dynamic-com v-model="form"/>-->
<component :is="dynamicCom" v-model="form"/>
</div>
</template>
<script>
export default {
name: "SlotContainer",
//不能在components里面使用$route,此时会是undefined的,所以不能在这里用路由参数的方式动态导入组件
// components: {DynamicCom: require(`../components/${this.$route.params.obj.itemId}.vue`).default},
data() {
return {
form:{},
dynamicCom:undefined
}
},
created() {
//在created这个钩子函数里$route有效,可以在这里用动态导入vue组件
this.dynamicCom = require(`../components/${this.$route.query.itemId}.vue`).default
},
}
如何通过路由参数动态导入vue组件
最新推荐文章于 2024-05-14 16:18:41 发布