您的位置: 首页 > 文章 > Vue.js学习笔记--条件与循环(2)

Vue.js学习笔记--条件与循环(2)

分类: 文章 • 2025-01-21 17:36:04

一，v-if指令---条件

1.创建dom元素

Vue.js学习笔记--条件与循环(2)

2通过改变isTrue的值控制页面的显示与隐藏，默认设置为true

Vue.js学习笔记--条件与循环(2)

3.访问页面显示为真，当在控制台江isTrue的值设置为false,则页面上的“真“消失

Vue.js学习笔记--条件与循环(2)

Vue.js学习笔记--条件与循环(2)

此时span元素不存在

二、v-for指令-循环

1.创建ol有序商品列表，用v-for指令绑定数组

Vue.js学习笔记--条件与循环(2)

2.将商品名称写入列表

Vue.js学习笔记--条件与循环(2)

3.最好我们将得到一个商品列表

Vue.js学习笔记--条件与循环(2)

4.控制台中push方法可追加商品

Vue.js学习笔记--条件与循环(2)