Vue.js使用Vue.js语法渲染模板

时间:2017-05-17 02:33:55

标签: vue.js vuejs2

数据变量

target_link_libraries

Vue的

 var data = {
        template:`<div class="box-word-cent">
           <h2>{{ title }}</h2>
           <p>{{ desc }}</p>
         </div>`,

        content:{
           title:'This is Title',
           desc:'This is. Description'
        }
     }

HTML

var vm = new Vue({
    el:'#app',
    data: data
});

我尝试将内容数据与模板分开,但似乎无效。

任何人都可以帮助实现这一概念吗?

1 个答案:

答案 0 :(得分:1)

尝试

var data = {
    template:`<div class="box-word-cent">
       <h2>{{ title }}</h2>
       <p>{{ desc }}</p>
     </div>`,

    content:{
       title:'This is Title',
       desc:'This is Description'
    }
 }

var vm = new Vue({
    el:'#app',
    template: data.template,
    data: data.content
});

只是

<div id="app"></div>

然而,这是编写Vue的一种不寻常的方式。