项目开发遇到一个需求：
1、其中一个页面写成模板，储存在后端，可根据选择渲染
2、这个页面里面什么都是不固定的，有方法，有样式，有跟后端的数据交互。
3、后端存的是一个字符串
例如：
<template>
<div>
这是一个测试
<div class="box" @click="clickTest">盒子测试</div>
<button class="btn" @click="handleSearch">element及获取数据测试</button>
</div>
</template>
<script>
import { search } from './api'
export default {
props: {},
data() {
return {}
},
computed: {},
created() {},
mounted() {},
methods: {
clickTest() {
console.log('点击测试')
},
async handleSearch() {
const res = await search()
console.log(res, '调用结果')
}
}
}
</script>
<style scoped lang="less">
.box {
width: 100px;
height: 100px;
background: red;
}
.btn {
color: green;
}
</style>
我需要把这么一个vue页面整体丢到服务器上去，然后我在需要的时候从服务器拉取这个页面并渲染到我想要的地方
目前有试过官方的异步组件，但是异步组件有关跟后台的数据交互会无效，并且是全局组件，暂时不考虑，当然，如果只有这种方式，也可以提，也想过只存储html代码到服务端，但是在方法绑定，数据交互，动画特效方面会很费事，不确定是否能实现，并且，实际页面需要触发的方法不少
