Vue.js入门(条件、in循环)

本文介绍了Vue.js中v-if条件控制的使用,通过一个错误案例解释了v-if指令的正确写法,并探讨了如何通过控制台进行交互验证。此外,文章还简单提及了Vue的循环语法,虽然未深入理解,但提到了使用‘todo in todos’遍历数组的原理,类比于HTML的for in循环。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

简单的 if 条件

可以对元素条件控制的属性 v-if
在这里插入图片描述

(上方代码有错误,你能找出来吗?)

在这里插入图片描述
如果我们把seen改成false会怎么样?
在这里插入图片描述
这时候我发现我还能看见这句话???为什么会这样呢
打开控制台 F12
提示vue有错
在这里插入图片描述
再回去看一看
在这里插入图片描述
懂了嘛,我vue的 v 没大写。。。(丢脸,以后谨记)

好了现在再看一下
在这里插入图片描述
以后就可以通过这样的方式 控制元素的显现与否了 [赞]

PS:

我之前一直没明白手册里说的在控制台输入是什么意思
回过头又看一遍的时候我试了一下(之前seen已经为false)
此时应该是看不见那句话的
这次我在控制台输入
在这里插入图片描述
下方的蓝色true是回车后自动出现的
当然自动出现的还有
在这里插入图片描述
原来控制台输入是这个意思
我之前一直在程序中写入,这样一来更好玩了



简单的循环

说实话这个我没看太懂,先记录上
在这里插入图片描述
在这里插入图片描述
此时控制台输入
在这里插入图片描述
这好像是返回此次插入内容在数组内的下标,同时
在这里插入图片描述
我是怎么理解的呢,todo in todos 其实就是遍历数组 todos,todo就相当于定义了一个变量用来遍历数组(类似for循环中衡量次数的变量)
上面这句话是错的,之前那个手册上的例子不好,我再举个例子
在这里插入图片描述
不知道这样你们是不是更好理解,反正我是懂了
在这里插入图片描述
在这一行中,son是指每次循环时对应的student中的元素(相当于子集),而 t 就是一个时间变量,用来遍历数组用的,数值等同每次循环时的数组元素(子集)下标
与html中的 for in 循环相似(仅仅遍历原理相似),可以借鉴理解下

然后我们在控制台中写入:
在这里插入图片描述
在这里插入图片描述

完美

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值