关于vue.js:奇淫巧技vue动态渲染htmlscript模板

vue动静渲染html/script模板

场景:页面html,script从接口动静获取,渲染出页面

解决

1.定义方法

newVue(script, html) {

  let main = eval(`(${script})`);
  
  main.template = `<div>${html}</div>`;

  new Vue({
    components: {
      test: main
    },
    data() {
      return {
      }
    },
    template: `<div><test/></div>`
  }).$mount('#app')
}

}

2.调用

newVue(‘{components:{},data(){return{text:’111′}},created(){},mounted(){},methods:{}}’,'<div><span>{{text}}</span></div>’)

展现后果

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理