vue 动态添加 HTML元素

共3个文件

js：2个

html：1个

vue

2星需积分: 50 76 下载量 139 浏览量 2018-06-13 17:27:22 上传评论收藏 103KB RAR 举报

温馨提示

如果 Vue 实例在实例化时没有收到 el 选项，则它处于“未挂载”状态，没有关联的 DOM 元素。可以使用 vm.$mount() 手动地挂载一个未挂载的实例。如果没有提供 elementOrSelector 参数，模板将被渲染为文档之外的的元素，并且你必须使用原生 DOM API 把它插入文档中。

资源推荐

资源详情

资源评论

收起资源包目录

vue.rar （3个子文件）

vue

jquery.js 93KB

vue.js 282KB

iview.html 1KB

共 3 条

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue example</title> <script type="text/javascript" src="vue.js"></script> <script src="jquery.js"></script> </head> <body> <div id='demo1'> </div> <template id="template1">  <span> <h1 style="text-align:center;" v-text="text"></h1> </span> </template> </body> <script> var MyComponent = Vue.extend({ //可以是HTML ，也可以是template ID //template: '<h1 style="text-align:center;" v-text="text"></h1>', template: '#template1', data:function(){ return { text:"Hello Vue.js!" } } }) // 或者，在文档之外渲染并且随后挂载 var component = (new MyComponent()).$mount(); //demo1 声明为vue实例 new Vue({ el: '#demo1', }) $('#demo1').append(component.$el) </script> </html>

评论收藏

内容反馈