本篇文章带大家了解一下vue中的模板语法,介绍一下插值语法和指令语法,并聊聊容器和实例的关系,希望对大家有所帮助!

我要一步一步往上爬~大家好,今天我们来一起认识一下模板语法这个概念!
一、模板语法
模板语法分为插值语法和指令语法两种。
立即学习“前端免费学习笔记(深入)”;
1.插值语法
插值语法是用两个大括号来表示的,用于解释标签体内容,{{xxx}}里面的xxx必须要是js表达式,xxx就可以在被解析后去自动读取实例中定义的属性了。(学习视频分享:vuejs教程)
· 标签体:这个位置就是标签体,举个栗子
插值语法
[插值语法就是标签体]Hello,{{name}}
[Hello,{{name}}就是标签体 ]
· js表达式:可以产生一个值的,举几个例子就明白了
- name
- 1+1
- ok ? 'YES' : 'NO'
· js代码(语句)是一种特殊的js代码,会产生一个值 js代码(语句):举几个比较常见的例子
- if(){}
- for(){}
2.指令语法
指令语法以v-开头,你应该不会陌生,包括v-for、v-on、v-bind......
它的作用是解析标签(包括标签属性,标签体内容,绑定事件),功能就非常强大了,我们这里举个v-bind的使用案例,它是用来绑定属性的,v-on则是用于绑定事件:









