vue动态加载组件请求后端获取需要加载的组件文件名
目录
vue动态加载组件(请求后端获取需要加载的组件文件名)
怎么总是给我这个只学了一个月vue的人提些奇怪的要求?
要求:前端页面跳转时,通过路由地址区别,请求后端不同接口,后端接口返回相应组件的vue文件地址,前端根据这个(些)地址加载对应组件到前端
主要用到的就是component中的is来实现
上代码:
<template>
<div>
<component :is="apps" :data="data" @componentResult="componentResult" />
</div>
</template>
<script>
import { test } from '@/api/test';
export default {
data() {
return {
apps: "",
data: null,
}
},
created() {
this.loadComponent();
},
methods: {
//test方法是一个请求后端的方法
test().then(res => {
this.apps = ()=> import(res.result);
});
},
}
</script>
只在这里写个例子,具体的按需修改即可