一、模板语法

1.插值语法：

插值语法往往用于标签体内容，标签体（起始标签和结束标签夹着的内容就是标签体内容）

举例：

<template><h1>你好。{{name}}</h1></template>

<script>...data(){
return{
name:'lqj'                                }
                        }
</script>

2.指令语法：

指令语法往往管理标签属性

举例：

<template><h1>指令语法</h1><av-bind:href="url">点我去火狐主页</a></template>

<script>...data(){
return{
url:'https://home.firefoxchina.cn/'                                }
                        }
</script>

说明：如果绑定属性时前面加上v-bind:就会使得vue把后面“”里面的东西看作一个js表达式来执行！

例如：

<template><av-bind:x="lqj"></a></template>

<script>data:{
return{
name:'lqj',
xingbie:'男'                                }
                        }
</script>

       上面的例子因为在x前面写了v-bind:所以vue把x绑定的lqj这个值看作一个js表达式（在这lqj被看作成了一个变量来执行）
        又因为data的return里面没有定义lqj的变量值，所以在执行的过程中vue会报错，不会运行出结果！

注意：只有"v-bind:"可以简写成":"

       总结：

       1.插值语法：

               功能：用于解析标签体内容。

               写法：{{xxx}}，xxx是js表达式，且可以直接读取到data中的所有属性。

       2.指令语法：vue中有很多指令语法（v-？？？）

               此处我们先用v-bind：（解析属性标签举例子）

               功能：用于解析标签（包括：标签属性、标签体内容、绑定事件.....）。

               举例：v-bind:href="xxx"或简写成:href="xxx"，xxx同样要写成js表达式，

                    且可以直接读取到data中的所有属性。

               备注：vue中有很多的指令，且形式都是：v-???,此处我们知识拿v-bind举个例子