vue声明式渲染、条件与循环、事件绑定、双向绑定

vue

一、声明式渲染

1、声明式渲染是vue对数据进行操作的模式,也叫做响应式渲染。

2、声明式渲染的两种方式:

(1)文本插值

HTML:

JS:

(2)绑定元素 attribute(这里v-bind attribute 被称为指令,意思是将这个元素节点的 title attribute 和 Vue 实例的 message property 保持一致)

HTML:

JS:

二、条件与循环

1、条件判断(v-if)

例如:



v-if 指令是判断表达式 seen 的值为true 或 false 。

如果为turn则显示文本内容上例中是(“现在你看到我了”),如果是false则不显示文本内容。

2、循环(v-for)

例如:


运行结果将会是

三、事件绑定(v-on:click)

  • 这里的v-on:click可以简写成@click。

四、双向绑定(v-model)

  • v-bind实现了数据的单向绑定,将vue实例中的数据同元素属性值进行绑定,如果要跟数据进行双向绑定我们就需要用到v-model。

    基本用法:

以上是 vue声明式渲染、条件与循环、事件绑定、双向绑定 的全部内容, 来源链接: utcz.com/z/375380.html

回到顶部