00:00
哈喽,大家好,我是霍长亮,这节课我们要讲的是UNAPP的条件判断,那么它呢,通常是用来判断是否要在页面中进行渲染,说白了就是是否要显示。咱们举个简单的例子啊,那么。比如说呃。我们再写一个吧,上面那个有点乱。之后啊,咱们写一个,比如说这是D。这是一节。关羽。好,我们现在点一下保存在这,你就可以看得到,对吧,这是一节课了。关于条件判断啊,因为我们现在用的是这个行级的一个标签,所以说它没有换行。那么我们如果说现在想要对它进行一个是否展示的这个限制怎么办啊,我们之前讲过啊,用V杠什么B。
01:11
当我鼠标点到这的时候,它这里就会显示根据元素表达式的值的真假条件渲染元素,在切换时元素以及它的数据方向等等等等,大概意思我们说就明白了。当这里你显示的是处。还打个二吗?手动打出来吧,当时处的时候我们点击保存,这个时候还是有的,对不对,然后当我们这改成false。F。应该会直接出来那个单词呀。
02:03
了吗?还是得手动打一下啊,好在这个串跟false也都是常见的单词啊,那么当我们这里写上for的时候,你再保存,诶右边它就没了,对不对,那么它呢,就是一个简单的判断啊,判断是否后面进行展示,如果说是force就是不展示,如果说是true就是展示fall。对吧。好,那么我们现在继续往下看,那么如果说我们想要把它变得复杂一点。也很简单啊,比如说我们在这看一个是否。显示啊,这名儿我自个儿随便写的啊,你也可以根据你的需求进行调整,然后呢,我们在下面再给他来个的定义。对不对,其实呢,正常的顺序咱们应该是先写下面对吧,好吧,咱先。
03:04
这你来一个是否显示。然后。冒号。比如说加2Q。好,那么我们在上,我们先点击一下保存,然后我们在上面这个位置。是否显示它就自然而然就会出现了啊,这里呢,就是因为我们刚刚已经写过了,所以说它这就有了,然后点击下保存。对吧,这里就是有了,然后呢。是否展示它所调用的是它的值,它的值是在这里对它进行一个定义,那么我们在这里改成。也没出来。啊,然后我们点击一下保存对吧。诶,他怎么还有呢,等一下我们再试一下啊。
04:02
这是一个条件判断,然后我们这改成force。为什么啊,因为我们在这里就不应该加这个。引号了,你如果说加上引号之后,它就会当成一个字符串来处理。对吧,那么我们。把它去掉,把它保存一下。没有了对不对,所以说呢,大家可以仔细看一下它的颜色,对吧,这个是一个逻辑性的真假是否对吧,我们可以直接在这里进行一个输出,其实这个呢,不仅说在咱们这个APP的便捷里面有相关的注意事项在咱们的。
05:01
预言里面也是有的,对吧,你比如说我们在这里输出一个。真。没有问题。我输出一个。也没有问题对吧,但是我们要是在这里输出。比如说真真假假,诶,然后我们再来点击它就会报错了,对吧,找不到指定质量,然后我们仔细看看它这个颜色,这里呢,是黑色的。啊,可能看的不是太清楚啊,这里呢,是一个蓝色的。能看到吧,在一元里面也是一样啊。那么同样的道理。咱们在。这边。如果说是字符串,你也加上引号,在语言里面也是。
06:00
一样,你想输出真真假假,你也得给他加上引号,然后我们再来输出,这回就没有问题了。懂了吧,加上引号的,它会当成一个文本,那也当成一个字符串来处理,如果说你不加引号,你要是真假呀,它就会当成一个逻辑性的东西来处理啊,颜色也是会不一样的,跟一言是同样的,预言的颜色也会变,但是也是会变的。好的,那么我们再继续升级一点啊,咱们再把高度再提的。高一点,咱们现在呢啊,讲完了直接是一个啊,False或者true啊,这是第一种,第二种呢,是它等于一个,呃。变量啊,是一个动态的变量,然后咱把这个变量呢,给它一个赋值,这是第二种,那么第三种呢,是把这个变量和另外一个数进行一下对比,对不对,那么我们在这你写的直接就是fair truth啊很好理解啊,我们再来下面一行吧。
07:10
我显示二啊。那么我们再来,下面再来一个。是主要显示二,那这个地方咱们为了和上面区别,咱们呢,就来一个中文对吧。我们来一个这。这个中文是用来做。判断用的啊,那么这个时候我们对应的它,对应的它我们再来。保存。下面的这个。没有。对不对,那么我们如果说不用这个true false想用中文来进行判断。
08:00
怎么整,咱们在这里边。来给它做一个。判断等等。然后。扣,我随便写一个,哈哈哈。宝宝点击下保存。这样啊,我把上面的这两个呢,先给他暂时屏蔽掉。这两块咱们暂时给他屏蔽掉。那么我们现在看它这里呢,是没有展示出来的。对不对,为什么,因为我们这里。
09:03
它的值是等于这段。而你想拿它和它进行对比,显然它和它是不一样的。对不对,那么我们在这如果说改一下。改成他,然后再来保存。对吧,这个时候。就出来了啊,那么就是它是否展示,由前这句话是否显示出来,由什么决定啊,由这个if来判定,那么当什么情况下它来展示呢?当它的值和它的值是一样的时候。就展示。对吧,那么它的值是什么,是这。那么这个时候我们对比了它和它是一样的,所以它就做展示,那么这个呢,就是第三种方法。在V杠,If里面等等等,就是一个相当于一言里面的一个,如果真的啊,一个对比的一个展示,我们再来准备写一下。
10:09
如果真对吧。它等于它。这边有一个乱码,我就打一下吧。啊,因为这是编码的问题,这个这个中文是用来做判断的。然后你在上面。
11:03
就给他进行了一个赋值。所以。它肯定是等于它的,然后在这儿。调是输出,那这样的话大家对比来看一下,应该就好理解了。啊。我们来对比看一下。在这就相当于是判断啊,它就相当于这里的这个如果针在什么情况下进行判断。它等于它的时候啊,它等于它的时候,那么当它等于它的时候,就做出一个输出啊,也就是说在这里进行一个输出,输出的就是这个内容,然后它呢,我们在一开始就给它进行了一个定义,对吧,它是等于它的,也就是上面的这个它等于它。
12:01
我们对照一言来看啊,因为我们之前是先讲一言的课程,所以说大家应该能够更好的去理解啊,关于这个v if的一个,呃,第三种。展现方式啊,使用方法。好的,那么接下来我们再做进一步的。升级对吧,我们结合之前讲的内容,那么我们如果说想要在这儿给他加上一个用户可以控制的,比如说人家用户点击一个按钮,点击之后,诶,他能在这里进行一个变化,对吧?那这个功能该如何实现?首先呢,我们先来看一下幻灯片对吧。啊B-F,这个是咱们的指令啊,刚才已经讲过了,下面要讲的呢,是这个组件啊,大家呢,可以把这个链接然后复制,然后在我们的浏览器中进行打开。
13:02
对吧,然后呢,我们可以往下找,比如说我们想要找的是按钮,那就是button对吧,这个呢,你将来你都可以对比的看一下,如果说你不知道,你点击这里,它这里就会提示哦,这个就是按钮,那下面的什么多项选择器啊,副文本编辑器啊,表单输入框。啊得得得得得,大家有时间自己去看啊,我就不带着大家你挨个去看了。Button啊,常见的,那么这个时候我们知道了它的单词是button,然后下面这些属性啊也有很多哒,对吧。那么如果说我们想要实现一个刚才我们所说的,诶,点击点击按钮,遵循view的标准的按click,对吧,我们只要知道了这句话就可以,其实他不写我们也知道。好,那我们现在呢。在这里开始写啊。
14:01
比如说来个B,看看写一个字它能不能出来啊。啊,可以有二个对吧,我们双击,那么它自然而然的就出现了一个button在这儿点击保存你看看。没有出现吗?哦,我们在这里可以写一个,比如说写一个名字啊,点击。然后保存,这个时候它就出现了点击这个按钮,对不对,但是呢,你点完之后,你会发现什么反应都没有,为什么?因为你确实没有给他做任何的一个。处理对吧,那么像我们刚才讲的点击之后,他想触发一个事件,什么事件啊,像我们说的,比如说来一个啊,对吧。在这里我们可以用me什么什么,那也可以直接写一个圈。爱的可。然后后面。你可以写一个名字啊,比如说是open。
15:06
然后我们点击一下库存。这个时候啊,咱们从里边来刷新一下。然后你看一下点击。对吧,点击之后这里就会有一个日志显示,为什么,因为我们上一节课。对于open做了一个定义,对吧,我们往下拉。在这里有一个哪去了啊这。Open。对不对,因为你在这里进行了一个open,然后它会输出这些东西,那么如果说。你在这把它删除对吧,我们再点击一下保存。我们这头。这里输出的日志。对不对,输出的日志有变化了,所以说这个呢,就是关于一个简单的按钮点击,然后你想让他实现一个什么什么的效果这样的一个。
16:10
功能对吧,其实在咱们语言里面也是有。比如说在这里一年的好处呢,你就可以直接的自定义化排版,我想把它搁这搁这搁这搁哪都行啊,如果说你在这个艾特编辑里面就稍微麻烦一点,但是呢,在他。运作的逻辑是类似的啊,也是需要备单击,然后你下面可以来调试输出啊,什么什么啊,同样的道理,他们在这头也是点击之后。它会有一个被点击,被点击之后有一个什么对应的一个命令,对吧,一个事件啊,这个事件是什么,我们在这儿可以写啊。好,那么我们像一开始所想的啊,我想通过用户点击来改变这里是否显示。那么我们就可以来改变它的这个值对吧,比如说啊,这个也暂时给它掉。
17:25
这是。用来测试点击影响效果用的啊,我们直接这样写,它肯定是直接会显示的,对不对,然后呢,我们可以在里面加上一个。没干。If。然后默认咱们可以是处。这里也是显示的对吧。
18:09
然后我们在这儿可以把它改成一个叫做是否显示。啊,这里有一个对吧,咱们用它吧。方便大家记忆,还是单独写一个吧,是否显示。三。好,然后呢,我们把这里改成是否显示三。对吧,现在它仍然是显示的,就像我们之前讲的,这里是否显示看什么,要看它的值,它的值。
19:04
是哪里,是这里是错对吧,然后呢,我们想要实现的是点击之后改变。它的展示方式,那么我们只要改变它的值就可以。点击之后,点击对应的是。这里。对吧,那么点击对应的事件是open,那open在哪?Open在这。我们。除了。在这里可以改啊,可以把它给删除掉,以防对咱们做。造成影响。然后可以用this。点。什么是否点击对吧,是。然后给它改成。大家保存一下。
20:01
诶就没了,对不对,这个原理大家应该能看懂吧,咱们再来讲一遍啊。那么他的意思就是说,当点击的时候,这个按钮我们点击了时候,它会触发到open这个事件,那么open这个事件所对应的open这个事件所对应的。就是执行了将。是否显示三啊,这个变量把它从把它甭管它是之前什么,把它变成了false,把它变成甲,那么它变成了甲之后。怎么样,那这里就会跟着别,如果说它是假,那这里就不显示了,对不对,这个呢都是。如影随形啊,同同生共死的,如果说他变了,它上面也就会跟着变啊。
21:04
好的,那么到这。咱们还能不能再升级一下难度还可以对吧,你就想一想,这个卡bug,你总要等到他有一个大bug的时候才能卡,那么我们现在就是在憋大招呢,一点一点的给大家增加难度,如果说我直接写到最后一个你可能看不懂,所以说呢,咱们把它区分成了1234多个步骤,那么现在我们把它也给它暂时。之后我们要写的是。
22:13
对吧,我们想形成这样一个效果,因为我们目前说学到了这个是否显示三的时候,你只能控制它一次,对吧?那我们想要让它频繁的就是原来显示我们点击之后它就不显示,原来要是不显示,我们点击之后就让它显示,那我们想实现这样的一个效果,能不能行也可以,对吧?那我们在这再加上一个V。你等。隐第七个的假期。然后我们来一个。是否显示四先写这个。是否?显示四。
23:06
我们可以给他一个起初的值,或是T。然后我们点一下保存,点完保存之后,在上面这里应该也就有了,这个是是否显示四四个对吧。我们现在点一下保存。那么现在呢?因为它是显示的是true,所以说这里是显示的,而我们想要实现的效果。这个open就需要更改一下。我们目前点完之后,他肯定就没了。这边。哦,不对,因为你现在它对应的它是三对吧,然后我们这应该调的是四了,那么我们现在把它也改成四。点一下保存。
24:01
对不对。当你点完之后,点完之后这里就没了,这是我们。上面所讲的一个内容,那么我们现在想要让它剪完没了之后,我们再点一下,还是让它再显示出来,哎,这就显得更高级了一点,对不对?那么这个时候我们要怎么剪?要怎么讲?这就涉及到一个新的知识点啊,你需要读取出来它现在的这个变量的值。对吧。读取出他现在的变量,就是你得先看看它现在是显示还是不显示。那么我们。可以怎么讲?Con。三点。L暴击。然后他现在的值是什么,是它。Is。点是否显示四第八个。
25:03
我们双击,然后我们来保存一下。好,这个时候我们看一下,这边咱们点啊,这边我清除一下对吧,咱们点的时候诶啊,除了上面的日以外,还多了一个。对不对,那么这个错是怎么来的,就是我们在这里做的一个输出啊,我们就知道他现在的状态啊,原本是错,然后呢,更改完之后,那更改完之后我们还想看看他的状态怎么办,你可以再来一个。点击保存。对吧,这个呢,就是更改前和更改后,那么我们填已经获取到了他当前的状态,我们想让它变化一下。怎么办?
26:00
啊,那我们就不用它了。暂时的。取消掉,咱们呢,可以用一个取反对吧。显示四八。等于取反命令是什么一个?感叹号。然后我们现在再保存一下。这个时候。把它清空掉,点击没了,再点击有了,再点击没了,再点击有了啊,那么这个呢,就已经实现到了一个比较。高大上的一个功能啊,相对于咱们上面的123来说,那么四难度就增加了,然后我们在幻灯片里面也备注一下给大家啊。
27:12
对吧,这个呢,就是取反啊。什么叫取反?就是原来是正的它就变成负的,原来是负的就变成正的,原来是真的就改成假的,原来是假的就改成真的,啊,这个呢,就是取反的意思。能不能难度再升级一点?还可以对吧,那么如果说我们想要让他改变这些字。的内容,而不是说改变是否显示。该怎么接?就是说我们点击一下,让他改变一下这里的这个字的显示,那么我们。就有了一个更加高大上的写法啊。咱们先把它。复制一份吧。我就不耐克打了托点脸。
28:02
在这上一课,咱们先给它是掉这个。嗯,可以给它格式化一下,这个格式已经很规范了,没什么格式化的。CTRL加斜杠加除号。制版就是把它进行评估,然后呢,我们想要点击之后更改的是它的内容,对吧,那么我们来判断一下是否。展示。那么这个时候咱们来一个来个五吧,来,来个五吧。是否?展示。然后。爆发。
29:04
这里呢,我们也可以写一个。是否展示?第五个之后就出现了一个新的语法。我们打一个问号,再打一个冒号,那这个时候呢,你就可以理解为。判断前面的是真还是假,如果说是真,那么写在这个位置,如果说是假,写在这个位。啊。
32:13
然后。啊。这个表达式我们可以理解为这个叫三元表达式。123对吧,看起来呢简单,但是对于新手来说呢,可能不大好理解,而且呢,它在使用的时候有一定的局限性。对吧,那么我们想要从欣赏角度讲,我把它简化一点,上面这个代码有没有另外一种表达方式,有对吧,咱们。在语言的课程时候,除了如果真以外还有什么?还有如果?还有如啊,那么如果真和如果就相当于是这里面的这个if,那么我们就可以再来一个如果,对吧?因为之前都是写的是如果真相当于是你你只要判断它是不是等于它,如果等于,然后执行什么效果,如果不等于呢?
33:12
没有对吧,你之前都没有,那我们现在就需要再来一个。衣服。If I对吧,那么这个时候我们就要用它。来实现刚才所说的这个如果,一元里面的这个如果。那么第一种。这里呢,我们还是先把它暂时给它屏蔽掉。偷个懒吧。它复制下来。你给来一个六。
34:07
然后上面也改成六。对吧,那么这样的理解的话,就是当是否显示六。是错的时候,这边就显示对不对,我们来保存一下,这里肯定是显示的,那么如果说。他这里。怎么样显示的是一个文本对吧。那你可以在这用文本来替换这个数对吧,那么如果说咱们这里直接就写一个数。行不行,可以更简单。那么这个截止到这里呢,咱们和上面一样啊,和它一样,还是相当于是一个如果真这样个性,那么我们如果想要把它改成如果的形式,就是如果判断啊,这种形式,咱们下面还得加上一句。
35:24
那这里我们应该写什么?一杠。对吧。它呢是和上面配合的。上面要写了前一兄弟元素必须有一杠。If。必须上面得有它,要不然的话你光有它,这个是一个错误的一个语法。现在再来告诉一下。
36:00
我们点击啊,发现诶没有变化,为什么我们这里应该没有改成六对吧,咱们。Often。好,我们保存一下。这个时候咱们再点击。看到了吧。那么点击之后。如果说是真的时候,那么显示是他。对吧,点击之后它会变成了取反,就变成了甲,那么甲对应的。明白了吗?这个呢,就是第六种情况。啊,那么到这儿算完了吗?还没完,那么咱们还能再继续升级一下,因为它不仅仅。可能只有这两种情况,对不对,他可能有第三种,什么叫第三种,那如果说是文本呢,他可能问是不是等于,比如说三个球是否等于第一个球,是否等于第二个球,如果不等于,也不等于第二,那它它可能等于第三个,对吧?那么那么这个时候我们就要出现。
37:09
下一个情况也就是if else if。先把它。再来一个。像我刚才所说的,假如说有三种情况,三种情况。啊,三个人就说是霍成亮或者马云或者奥特曼。
38:06
啊,比如说我们三个人。那么你根据点击的时候,如果说是不同的人,然后就显示不同的对应的字符,那想要实现这样的一个效果。默认呢,咱们是过程量,那么在这个时候啊。点一下这个保存。在这里。是过长量的时候的显示,对吧,这是第一种情况,那么我们在这比该怎么写。微杠if第七个。
39:00
是否是否显示第七个。好,我们现在点击一下保存。当时货商量的时候的显示,那么如果说第二种情况。当时马云的时候的显示啊,那这个时候呢,我们。当时。马云的时候的显示,这个时候我们就有一个。微杠。第四个。转匀,然后呢。怎么样?就会有最后一个。
40:01
敲两个字母,然后找到test第三个。然后这是最后一个的显示,这是最后一个的显示。然后V。第三个。在这里呢,我们就不需要再写一个等于什么什么为什么,因为你一共就仨人,不是货商亮,也不是马云,那最后这个肯定是什么,肯定是奥特曼对吧,一共就三对不对,那我们现在保存一下,因为这里有一个错误,我先给大家演示一下啊,保存。这个时候。我们来点击没有反应对吧,咱们先改一下这个点击所对应的啊是七。
41:02
是不是?那我们来open open open open。TH。点。七。等于。过商量。对吧。这个情况我们现在点,诶它还是没有变化,因为它原先默认的展示的就是货商量,然后你点完之后,它还是货场量,所以说它没有变化,对不对,那么这个时候我们如果说。不是火场量。比如说我们加个一。我们再来看一下。我加个一,但是还没有变化,因为我们这里面谁都没有,我们改成一个马云。
42:04
我们来保存。这个时候再点击还是没变化是吗。因为你这里改了马云,可是你上面你没有改,对不对,我们这里直接写马云行不行不行啊。我们之前讲过,正常的判断是什么?是三个等号。对吧。一二、三三个等号。如果说他。等于。货长量,那么这个时候显示的后面这句话如果说。这里。少了一个是吧。啊,如果说这里是是否显示七。
43:07
等等。如果说它的值是马云,那么显示的是对应马云的值,对吧,那这个时候再来保存一下。诶,那么这个时候它已经变成了反应,但是我们点击还是没有反应,为什么。因为我们。点击就会把它变成了马云,那这个时候呢,我们改成过上量。这个时候。它就变成了货上量对吧。好,那么我们再仔细捋一下这个思路。当默认值就是当这个值是过长项的时候,展示的是它。
44:05
对吧,啊。刷新一下。默认值是货长量对不对?为什么这里显示货长量,因为看下面吧,他给了他一个默认值是货长量,然后呢,当我们点击这个按钮的时候,为什么会变成马云点击的时候它会触发到。一个open的这个事件,而open的这个事件就是把是否显示七更改成了马云,所以说。在这里啊,刷新一下,默认是扩张量,那我们点击它就变成马云了,然后那么我们如果说在这里写一个随便写个东西,大家保存一下。再刷新一下。点击之后,它会显示最后一个。为什么?按照我们上面的说法,一共不就三个吗?我们点击之后,它的值变成了马云六个一,既不是过长量,也不是马云,那么就是第三个。
45:10
对不对,你一共就三个,既不是他也不是他的,肯定就是他啊,所以说在这里你无论是否写的是奥特曼,他都会输出是第三个。大家能够懂我的意思吧?
我来说两句