笔记二、Vue学习 模板语法

模板语法官方网址

一、插值

1.1 文本插值： “Mustache” (双大括号)

<p> Message: {{ txt }}</p>

1.2 使用 JavaScript 表达式

{{ number + 1 }}

{{ ok ? 'YES' : 'NO' }}

{{ message.split('').reverse().join('') }}

<div v-bind:id="'list-' + id"></div>

二、指令

2.1 参数

定义：指令 (Directives) 是带有 v- 前缀的特殊 attribute

指令	举例	缩写
v-for
v-if
v-bind	v-bind:src=" "	:src=" "
v-on	v-on:click=" "	@click=" "

2.2 动态参数

定义：可以在指令参数中使用 JavaScript 表达式，方法是用方括号括起来：

<a v-bind:[attributeName]="url"> ... </a>

2.3 修饰符

定义：修饰符 (modifier) 是以半角句号 . 指明的特殊后缀

<form v-on:submit.prevent="onSubmit">...</form>