template

Vue中template的三种写法：

1.直接在页面中写

var app=new Vue({
     el:'#app',
     data:{
         message:'hello，少年!'
      },
     template:`
        <h1 style="color:red">模板一写法</h1>
     `
})

2.在HTML中写：

<template id="tem2">
             <h2 style="color:red">template标签模板二写法</h2>
    </template>
    <script type="text/javascript">
        var app=new Vue({
            el:'#app',
            data:{
                message:'hello 世家!'
            },
            template:'#tem2'
        })
    </script>

3.借助script 写模板 
<script type="x-template" id="demo3">

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

4.使用了vue-cli之后，会有xxx.vue 里面包括 template，script，及可分离的结构。