美文网首页
Vue创建模版template

Vue创建模版template

作者: 大孩子气 | 来源:发表于2018-02-06 17:40 被阅读0次

一丶直接写在选项里

 var app=new Vue({
     el:'#app',
     data:{
         message:'hello Vue!'
      },
     template:`
        <h1 style="color:red">我是选项模板</h1>
     `
})

二丶写在<template>标签的模版

<template id="demo1">
    <h2>标签模版</h2>
</template>
<script>
    var app =new Vue({
        el:'#app',
        data:{
            msg:'hello',
        },
        template:'#demo1'
    })
</script>

三丶写在<script>标签里的模版

    <script type="x-template" id="demo3">
        <h2 style="color:red">我是script标签模板</h2>
    </script>
 
    <script type="text/javascript">
        var app=new Vue({
            el:'#app',
            data:{
                message:'hello Vue!'
            },
            template:'#demo3'
        })
    </script>

相关文章