各位小伙伴欢迎来到我们的第三章节哈，六三通关系列，今天我们来讲一下 two r e f， 我们 two r e f 的作用其实就是将我们的 rector 代理的数据，把它的中的属性变成我们的 r e f。 首先我们来打开看一下， look 一下， 打一下我们的内幕，这个就会变成一个 r e f， 来到我们浏览器运行一下， 我们来检查一下，检查时候这里会得到一个 object， r e f 这样的数据类型。首先这个下颚线 r e f 表示已点没有拿到值，这个 k 就是你代理的那一个属性。 object 是他的原有的那个对象啊，原有的那个对象，这个表示 默认值是没有的昂，立法刚开始没有值，那么这里拿到的就是我们这一个来拿到的就是我们这个数据，看到没 recture rectube。 那么紧接着来到我们的代码， 代码，我们这个 tourf torf 它是怎么做的呢？第一步，首先它返回的是个实名对象，对不对？刚刚打印看了，那么 torf 它是个方法，它返回首先是个方法，返回实名对象，来到我们自己实现的这个圆码来看一下。 首先我们这个 two r e f 传一个我们要代理的，将我们的目标对象的属性代理成 r e f， 它返回的时间，时间对象那就是个内在，里面有几个属性， 有几个属性之后其实本质就是什么？就是一个代理，就是通过我们的内容的 get 和四大方法，当你获取值的时候干什么拿到这个 rector 中的属性，这个 rector 就 那个对象，它里面是不是显示的数据，把它拿到这个数据就是显示的，当你干什么，当你设置值的时候干什么？对他的值进行修改，这个就是他本质 tour 也否非常的简单，就是 将我们对象中的啊，就是我们的通过 reactor 代理的显示数据中的属性变成 r f， 它的底层代码就是 class， 通过 class 你们的 get 和方法， get 和 set 方法来进行代理，当你获取的时候通过 get， 当你设置的时候通过 set， 那么基层代码。刚刚带同学们也看了哈 r f， 我们这个 two r f 是非常简单的，看这个就是我们的 two r f 的基层代码，基层代码就是本质就是一个代理。
粉丝284获赞1267
相关视频
01:29查看AI文稿AI文稿我们在使用 vivo 三定义响应式数据的时候，要使用这个 rife， 然后在用这个数据的时候呢，要写上点 w， 这个方式比较麻烦，我教给大家一种简单的方法，我们反问 vivo 三的官方文档，然后拖到最下边，这块有个响应式语法堂，先点击显示启用， 然后呢把这个包用 npm 或者压下来装一下，装完之后的话呢，在你的 witch 文件当中进行配置，那我在这里边已经配置完了，如果你使用的是 ts 的话呢，那需要对 ts 进行配置，我们靠配这段代码放到我们的生命文件当中。好，我把这段代码已经复制过来了， 现在我们就可以正常使用了。我们这时候呢，在这块就可以给他换成倒轮，具体的详细使用大家可以看文档，那我们就可以不用使用这个歪流了，但是你要注意这块的话呢，如果你有负值操作，那这个变量你要改，把它改成 let， 比如说这块你要负值，是吧？一定要这么写。那么如果对， 可以看一下我录制的 gs 的系统课程讲的很全面，现在我们在使用 propos 的时候也会变得非常方便，我们可以直接设置默认值，而不需要使用 which default 了。呃，当然我们也可以对这个变量进行改名，是吧？给它改成 a b c， 你可以进行别名的定义，不过呢，这是试验特性。说一下，在这块儿会有提示，大概意思就是说这个功能是试验阶段， 以后有可能会进行更改，所以建议你明确的指定你的版本号。那大家看这个项目呢，就是晚上咱直播讲的雷若加 vivo 的系统平台项目里边的话呢，我就使用了这个最新的特性，写起来的话呢，确实是省事。
492后盾人
07:07查看AI文稿AI文稿hello， 大家好，今天我们来讲一下 vultify 中的 activator 技术啊，视频可能会有点长，所以先点赞收藏起来，后面反复观看呢。我以 dialog 组建为例啊， 我这里放了一个 download 组件对话框啊，当我们想要打开对话框的话，传统的做法是我们在外面放一个按钮， 点击这个按钮的时候打开这个 download， 是吧？在这个 download 头像上，微杠 model 绑定一个 download， 然后在上面定一个 download， 等于 i f force， 然后点击这个按钮的时候， open download 上面写上 一个 itcle， 等于 dialog。 好，我们看一下效果，我们点击这个按钮， ok， 这个 dialog 内容显示出来啊，这是一个传统做法，但我今天不是说想要教你怎么使用这个 dialog 吗？ 我主要是想讲他的这个 xtv 的激活器啊，我们换另外一种方式，这种方式我们需要定一个这个变量啊，响应式数据啊， 那这种方式操作这个 download 组件的方式就是受控组件的，我们讲另外一种非受控组件的方式，我们这个只是删掉啊，微杠 model， 删掉啊， 这个按钮我还是保保留一下，可立刻事件我也删掉啊。我们把下面这个 download 直线丢到 这个 button 指点里面进去啊，然后在这个 download 键上面加上一个 activator， 就是它，这是什么意思呢？就是说它由谁激活的那最简单的方式，这个 download， 这样我已经把它放到这个 button 键里面进去了，是吧？那我们只需要指定它的 activator 是 parent， 这样就够了。完成了，我们再看一下效果，点击你看依然可以打开， 这种情况下我们没有定任何的变量啊，整个过程中在这个位跟巴特里面把这个 w 中间包含进去了，他和刚才那种方式有什么区别呢？就是刚才的方式区别就是这种方式 它不需要定义变量，而且它还有一个动画呀，它这个动画这个 download 会从这个按 按钮这个地方往下面打开的一个动画，那他还有其他的方式进行打开啊，我这里是使用了这个 parent 这个 tv 的，他有很多种写法呀，我们把这个 download 放在外面呢，放在这个 button 的外面，我们再把它这个加上一个，比如说给这按钮加上一个 id 呀， 然后呢，我再把这 x t v 的激活器写成一个井号 button， 再看一下一样可以，我们把它变成 class 选择器，那这里就不是井号 button 了，就点 button 了， 一样可以。好。最后一种方式是我们使用 r e f 控制一个 activate， 等于一个 r e f， 我们给这个按钮上面加上一个 r e f activator， 那下面这个 download 上面的话， activator 就等于那个 activator， 看一下 一样可以啊，也就是说我们操作这个 activator 的方式有。嗯，首先第一个是 parent， parent 应该很好理解，就是通过它的负极来把它激活。第二个就是我刚才使用了一个 id 选择器啊， 我第三种使用了一个 class 选择机啊，最后我使用了一个 r e f， 这个 这是绑上去的啊，来激活它。注意这里的 id 选择器和 class 选择器，它本质上里面是使用了一个 document curi select 啊，这就是它的激活 气啊，这个 itv 段，呃，刚才还有一点没有讲到我们点击会显示这个 download 里面内容啊，那这时候我们想要关闭怎么办呢？我们可以点击空白处关闭是吧？但是有可能的话，这个地方 他不能点击空白处，就是说你需要他点击某一个确定让他关闭是不是？那怎么办呢？ 他这里也是有办法的，比如说我们在这里面加上一个，里面加上一个 v 杠逼天， 我们想要点击这个时候关闭这个 download， 管你们看一下啊啊，现在他 closed close 他根本不会起作用啊，但是他这里还是有方法的，在这里还有一种方式就是这个 download 组件，是吧？我其实这个看的和这 这个按钮它本质上来说属于这个 download 中间的这种默认卡槽啊， the template 井号 default， 这波纹卡槽里面我们可以结构一个信息啊，叫 is active， 我们把这卡的主线或者按钮主线丢进去啊，我们点击下面这个 close 按钮的时候呢，可以直接给他一个 id click， 点 value 等于 force， 他这个其实就是个 r e f 啊，我们再看一下效果啊，我们点击这个 open， 再点击这个 close， 没有问题啊，注意这个 clouds 是在这个 download 里面的啊，我这里使用的它激活器是它的 parent 啊，但还有一种写法是我们把这个按钮写进去啊，就我们把它的关闭按钮和它的这个两个按钮都写进去啊， purpose， 我们把这外面这个按钮啊，这后面这个显示的注意这里，那我们就需要微半的把这个 purpose 传给他， ok， 保存，再看一下，点击一样可以啊， 这样的话他整个都会在这个 download 里面的，那你封装的时候就会哦，我应该把这个 power 去掉。不好意思啊，这是点击我们会看到他从这个按钮这个地方展开这个 download， 这就是他的 activate 这个用法呀，他其他组件上也有这些啊，我把 我把这些有 activate 的这个用法的组件全部列出来，就是 menu 组件、 dialo 组件、 tootype 组件、 o 类组件、 snack bug。 这个组件有一个共同特点，就是他们默认不显示啊，他们需要依依依靠一个另外的组件来激活他或者显示他，控制他显示啊，就是他这些组件的共同特点呢，他们上面都会有这个 activity 的这个 卡槽啊，这种技术啊。好的，今天的分享就到这里，关注我，教你更多前端知识。
45程序员𝐋𝐞𝐫𝐭𝐞
01:07查看AI文稿AI文稿有位网友发来这样一个问题，在 view 三中使用 reactive 定义了一个响应式的数组，在网络请求完成后进行复制，但是试图并没有更新。 打开控制台的确可以看到数据，试图也已经进行了渲染，但一片空白。在触发事件时，此种方式不会触发。试图更新，因为地址指向变成一个新的地址，我们可以改用 ref 来进行定义，通过点 value 的方式进行复制， 可以看到数据可以正常显示。还有两种我比较常用的方式，同样使用 reactive， 不过要以对象的形式将数组包裹给对象属性复制也是可以的。还有一种方式，我们 回到最初的代码， 采用 pose 的方式来更新。关于这几种方式的实现原理，相信路过的大佬会在评论区留下答案的。
799茄子懂编程🙈
06:08查看AI文稿AI文稿啊？计算属性怎么弄？哎呀，又又又问到这个点了哈。啊，好，那咱现在写个 sorry， 然后写组合一篇啊，刚才说了这个计算属性，对吧？计算属性的话具体怎么用呢？就直接写这个 直接还是结构出来啊？把这个计算属性给他结构出来啊？比如说咱印 pote 引入一个结构出来的这个 ctrl t 的啊，从哪呢？从这个 vivo 啊？因为因为咱们常用的，比如说，呃，刚才说的什么叫易函数啊？说这个 r、 e、 f 啊，显示啊，这些东西都是从那个 vivo 里结构出来的啊，所以说这个 ctut 的也是从这个 vivo 里结构出来的。 看这个标题的是小写，小写不是大写。结构出来之后然后怎么用呢？比如说我现在页面上就写一个， 写一个这个数字啊，叫南博，南博，然后我们现在 我们现在想让这个南博士 ctrl t 的计算出来的啊，那怎么写呢？那咱就定一个敞亮，定一个敞亮叫什么呢？叫南博，南博等于什么呢？等于这个 ctrl t 的计算属性，在这里是个方法，方法括号，对吧？然后里面我们传一个函数啊，然后这个函数就可以直接蕊翠，比如蕊翠一百，蕊翠一百，然后塞他把里面 需要锐衬这个南博，对吧？然后咱看一下现在的效果啊， 刷新一百，对吧？这个就是 ctrl d 的一个用法啊。计算属性啊，那有小伙伴 说那个计算属性，呃，什么时候用呢？具体具体怎么操作啊？比如说咱们写一个呃，计算总价的一个例子啊，假如说这里有苹果，对吧？苹果 苹果啊，这个零点零点五元一斤，哈哈， 然后我现在想实现一个计数器啊，然后我通过这个计数器 来实现添加苹果的数量和减少苹果的数量，导致咱们可以通过 计算属性计算出一个总价来啊，那咱们选一个这个功能啊。好，那我现在需要一个计数器，计数器的话就是，呃，八层，八层， 这个是减啊，然后克丽克等于什么呢？等于减是 d q s， 然后咱再写个加，加是什么呢？加是英格瑞斯，然后中间呢？咱们加一个数量啊， number 死半死半，然后这里有一个 南博，然后下面呢？还应该有一个总价的吧？比如说写个 a 券， a 券这里有一个总价总价呢？是，比如说咱就叫偷偷 pro， 那如果是一个这个功能啊，大家看这个页面啊，苹果，然后计数器，然后总价啊，那咱应该暴露的一些内容的话，咱们应该在赛太二版里面，首先我应该定义一个，呃，减少和一个添加的一个计数器的一功能，对吧？啊？那咱们先把计数器的功能给他写出来啊。 好，那咱看一下，这我先给他去掉，咱先把计数器的功能给他写出来。首先这个单波咱还是定一个单波， 那这个男波呢？计数器开始零，对吧？计数器开始零，所以说咱就 r e f 括号零，从零开始一个数值，那 r e f 得给他结构结构出来啊， a f r e f 结构，呃，显示将对零变成一个显示的变量啊，然后我现在需要写两个方法，一个叫 啊英格瑞斯，翻个身 英格瑞斯，然后再写个迪克瑞斯减少翻个身 迪克瑞斯。那这个添加和减少是操作谁呢？是不是操作这个南波啊？所以说是这个南波点歪溜啊，这个英格瑞斯是加加，然后这个是南波点歪溜，迪克瑞斯是减少减减啊，然后我们暴露出这个南波， 暴露这个男模之后呢？还得暴露这个银克瑞斯，还得暴露这个迪克瑞斯。 保存，然后看下现在的效果啊，刷新啊，然后这个添加添加添加添加添加减少减少减少减少减少啊， 计数器是没问题了，对吧？没有计数器之后，嗯，那个计数器没问题之后呢？咱现在需要计算这个总价头头 pros 啊，然后咱们用计算属性得到这个头头 prs， 那就是亢死他。 tutublex 等于什么呢？等于一个 ctrl t 的计算属性啊，那这里面呢，我们传一个函数啊，函数的话， 那应该先计算这个结果，对吧？计算这个结果呢，就是这个数量啊，南博乘以这个单价，单价是零点五，对吧？所以说咱们蕊称的是什么呢？蕊称的是这个兰博点 v 六，然后乘以这个零点五，这样的话就计算出了一个总价了。好，那我们再把 tot plus 给他暴露出来啊， 暴露出来，然后看一下效果啊，一二三四五六七八九十啊，十个苹果是多少呢？是五块钱啊，这样的话，咱就利用这个计算属性 ctrl g 的来实现了一个呃，计算水果的一个效果了。
157晓舟
05:19
00:31
03:19查看AI文稿AI文稿好，我们来看这道面题，他问的是 i e f 是什么？首先我们要知道 i e f 呢，是写在这个标签上面的啊，就跟一个标签的属性一样，它具体的一些功能呢，就是来方便我们 g s 获取它的一个 dump 的，那所以说言简意该就是 i f 是什么呢？来获取 盗墓啊。那么在我们的 g s 原声中呢，可以通过比如说 document 点 get aliment by 地获取到这个盗墓，那么用 r f 呢，就比你写那一大堆啊，就是 document 点 get aliment 比这个要简单一点，提供了更多的方便性啊，就好比说指快瑞，他有一个选择器，对吧？ 你不用再写 document 的什么什么玩意了，也是很方便的啊，就是 vivo 这样呢，给我们提供的选择盗墓的方便的一个东西啊。好，下面呢，咱们就一起来试一试啊，那我把这呢打开，比如说我们这有一个 d i v， 行，那现在呢，我要知道这个 d i v 它多高，那该怎么办呢？那你肯定是要获取到这个动物，对吧？然后呢，知道它的一个啊，比如说 clean the height 呀啊，或者说 opposite 啊等等这样一些东西。所以说呢，我们要把这个动物呢，先要给它获取到，当然获取的方式呢，也是比较多的 啊，比如说我们可以给他加 id， 那咱们就举个例子，比如这儿一个引妹子吧，那我可以给他加一个 id， 然后这 id 呢，我就叫他引妹子，行吧。然后我们在这个 monkey 的中啊，注意，之前我们说过生命周期了， crazy 的中呢，不可能拿到这个盗墓啊，因为他没有 e l， 对吧？所以说我们要在 monty 的中拿到这个盗墓啊，那可以通过 document 点 get element by id。 好，然后呢，我们把这个拿进去，那这个时候呢，咱们打开这页面，那应该呢就有对应的这个元素了， 是吧？我们看一下。好，大家可以看到这有个 image， 对不对？那当然这样显得也太复杂了，我们可以还用一个简单方式，就是 i s， 比如说我这儿写了一个 image s 吧，那通过 i e f 呢？我们就要这么去拿，就是 this 点倒数 i e f s 点儿啊，然后咱们再来看，稍息， 好，大家看，上面呢是我们通过 document 获取到的，下面呢是通过 i f 获取到的，咱们再刷新一次。 好，这时候大家可以看到了，就有两个东西了， ok， 这就是下面这个，所以说呢， i e f 呢，就是给标签呢加了一个 i f， 对吧？然后在我们 g s 中呢，通过 this 点 dollar for i e f s 来获取了这个动， 那就比你这样写你要简单一点啊，你比如说你要获取到它的一个 clean the height， 对吧？这都可以啊，这都可以刷新， ok， 那他的肯定的孩子是菱角是吧？好，不管了，因为你这没有给他设定一个宽，设定一个高啊，行，我们知道 if 是干嘛就 ok 了，那么其实呢，在更多的时候呢，我们的 if 呢，要结合下面这个玩意儿他们一起来做 啊，比如说 if， 它的使用场景就是大家见过那种，呃，联动的吗？啊，比如说咱们看一下啊， 像这样的一个分类，它的左右是一个联动的，对吧？比如点这点，这点，这你可能要获取到这个盗墓，所以说呢，你要通过 i f 呢获取到这个盗墓，然后呢？比如说你滑动也好，是点击也好，干嘛干嘛也好啊？那可能会需要用到这个 i f 啊，这就是它具体是什么？ 那就很简单来获取到我们的。 ok， 行，那关于本节课的内容呢？咱们就先到这里。
66前端程序员
05:12查看AI文稿AI文稿好，我们上一堂课呢，把这个删除我们给完成了，那这一堂课呢？我们来看一下添加。 呃，就是我们的元素展示时候那个动画效果，那分几块啊？第一个当我们页面初次刷新的时候，我们希望这个元素是一个一个出来，还有一种情况呢，到我们最佳元素的时候，那么他也有动画效果。呃，不过这个元素居家到下面了，我们把这个问题修正一下啊。 好，我们让他默认是降雪，这个是咱们之前张杰写的啊，所以呢，你就刚才我修改的地方不明白，你一定要按顺序看啊。 好， ok， 这样可以了，那我们现在来开始调整，那我们来分析一下，我们要让他一个一个展示，所以呢我们就得要通过编程的形式，我们的样式是批量控制，是吧？所以我们要通过编程的形式来控制这个动画。这个来咱们之前 假过了，那很简单，我们要设置这个通过编程的形式吧， 通过这些勾着函数来完成。那么这块的话呢，我们定一个初始的时候， 不过这时候啊，你注意我们要装谁呢？把这个 jsaper 给装上啊，好，把他也装上。装完之后的话呢，我们在这块把这个 jsap 给他拿过来。 好，然后在这里边的话呢，我们就可以使用这个。这个包，是吧？我们要控制 el， 然后呢给他测这个初始的值，让他透明度啊，为零，就是在起初的时候别让， 要让他的透明度为零。好，要让他透明度为零，然后之后的话呢，我们再进行这个。嗯，找到这块啊，好， 再来一个 勾住，是吧？我们开始来定义他的过渡， 这钩子的话呢，我们需要第二参数啊，在这里边我们来定一下， 我们来定一个远处，让他的透明度为一，然后呢我们可以再定一下他的过渡时间，比如说是点六秒。 好， ok， 好，这样的话呢我们就定完了。其次的话呢，我们希望页面展示的时候就要有效果， 我们要加这个属性，是吧？让页面渲染的时候，他就产生这个过渡的这个动画效果。好，我们刷新，那其实这样的话呢，会有一些效果了已经，对吧？然后的话呢我们要定一个延迟， 有关于这些啊，其实就是 css 的过度的属性，你有时间的话呢，把我讲的 css 那个课上还是看一下，这是我们刷新，然后到过了两秒之后，两秒钟之后才出来，不过我们他是批量出来的，我们要一个一个出来，所以呢我们只要把这时间给他变化一下就行了， 我们这块可以已经读到这个元素了，所以呢我们的元素加那个 dese index， 让他直呢，就是我们这个 index， 好像我们这块没设置 index， 那给大家来读取 index。 好，那这样的话呢，我们给这个这个标签啊，设置这个制定 属性，我们在这块的话呢就可以通过 date set 来读取到这根带子，然后我们乘一个零点零点三保存，这时候呢我们这效果已经出来了，看到了吗？ 咱们刷新看到了吗？这个效果已经出来了，非常好，那你可以根据需要把这时间进行调整，是吧？ 所以当我们页面刷新的时候，这个就是一个一个出来的。好，然后呢我们再来添加一个，添加一个，比如说随便写一个吧。好，这时候我们这个动画也是有的，是吧？一样也是没有问题的。 好，回车一样是没问题的。好，我们动画是没有任何问题啊，我们刚才空的，我们没有交易啊，所以他就他可以回车时可以添加 空的。那你不允许添加空的话呢？你就在这块在添加的时候对这个内容进行下交易就行，是吧？就是如果这个图度的胎头为空是吧？ 唯空，那我们呢就返回一个不能为空是吧？ 好像是输入法不能为空。好，那这时候的话呢，我们在这块来进行尝试，我们给他切在我们的浏览器当中， 然后呢把它调出来，然后在这块的话呢，我直接下回车就不能为空，是吧？有的时候 vi 扣的里边的那个浏览器啊，可能有点问题啊。好，那现在的话呢，我们往里贴内容是吧？比如说 向军大叔，然后回车转一回动态的产生，然后因为刷新的时候的话呢，也是一个个出来。好，那本堂课呢，我们就介绍到这里，感谢大家收看，再见。
184后盾人
19:55查看AI文稿AI文稿好，这节课呢，我们要做内容是会员课程和免费课程这两个条件的筛选。那下面呢，我们先看一下这个布局啊，这个布局呢是用的 alemit 一个组件啊，就是 alemit 里边的一个单选按钮。那下面呢，我们就来看一下 alemit 这块哈， 那它这呢是有一个 vivo model 啊，这个 vivo model 呢，里边有一个数据，那这个数据呢，它定义值是为三，然后这呢哪一个 label 进行匹配？比如说这是三，这个 label 三，那它就匹配到了，那它就会被选中。 换话说呢，如果这个数值是九或者是六，比如说是九吧，那他就会被选中，是一对一的关系哈，所以在这呢，咱们就很好去把控这个点了，比如说这有个 level， 他是一，他是二，对不对？那如果说我这呢给他写个数据啊，比如说 we got model， 我要写个数据。 好，假如说这个数据呢，他是一，那上来他默认就会变亮。比如说选中啊，我们下面呢去写一下，这是我们的选中的数据啊， 来往下走。呃，会员免费课程和会员课程的数据。 好，那我们这儿呢，就来一个 r e f 是吧？我这儿写个一，如果写个一的话呢，上来我们这个免费课，他就应该会被选中啊，这儿呢，我当然要加一个 撸串啊。好，你看他上来会不会选中，那我们上来呢，其实是这两个都不选的，那我随便给一个吧，比如说给个零，或者给个一半，无所谓哈，只要不是一和二，就他就不选中。然后下面呢，我们就进行切换。那进行切换呢，有两种方式啊，第一种方式呢，就是我们可以采用他的事件， 那在下面呢，他提供这样事件就称职事件啊，也意思说我们在上面呢，可以给他加一个称职，对吧？等于随便写一个称职的一个单选好，然后下面呢，我们可以写对应这个方法， 呃，比如我在这随随便来哈，这是我们的，呃，免费课程和会员课程切换好，我们可以把这个 方法写到这，好，然后呢当我点一下呢，他其实在这呢是有一个 e 的，那个 e 呢？就是你点的是谁？比如说你点的是第一个，那他会打印他的对应的这个，呃，值啊，比如这是一，这个是二啊，就 level 那个值，这是一，这是二 啊，这是一种方式，那也意思说我知道了一二，那这样的话呢，我就可以传递对应的数据，然后让我这的一个课程内容呢，他的数据本身发生改变，对吧？这是一种方式。当然如果说你不希望用这种方式，也是有很多方式的啊，比如现在我就不用这个方法这个形式， 那是不是我们也可以通过 watch 去接听它的一个改变呀？因为上来呢，并不会啊，有一个这个默认选中，对不对？那我可以 拿到我们之前所讲过的 watch， 哈，那就把这块拿过来啊， watch 是吧？然后把这个值放到这。好，然后，呃，这个不要了。好，那这样话呢，监听数据的变化，如果他改变了，我们也可以，是吧？得到啊，来，咱们再来看， 回到我们的控制台来上线一下啊。好，现在呢，我点击免费，是吧？那前面这个就是一，后面这个就零，然后点一下，你看是不是就等于免费课程他就是一，然后会员课程他就是二， 那免费课程对应的就是 new value 是吧？ o 的 value 呢？就是对应的是二嘛？啊，这样话呢，我们就知道这个值了啊，大家可以看一下 啊，如果说我们的这个 new value 它是一啊，那就是点免费课。如， 如果说我们的，呃，这个 o 的外流是吧？ o 的外流哎， o 的外流它是老值哈，那不行，那我们只能判断 new y 六等于一或等于二的情况。好吧，因为是最新值和旧值啊。 那当然，在笔记中呢，我也写了对了这个逻辑了啊，比如说我可以通过卧室行驶，或者是通过趁事件行驶，如果通过卧室行驶呢，都要判断是 new y 六啊，那我们这样就可以判断如果说 new y 六它等于了一，那则怎么样？那就证明我们这儿选中的是会员课程啊，选中是免费课程， 免费课程啊， airs， 那这个地方呢就是会员课程了 是吧？那这就是会员，会员课程。好，那么我们下面呢是要切换课程的数据的 啊，切完课程数据，那不管你是点一，或者就是说你点免费课，收费课不管点哪个，他都会进行一个我们的课程的请求，所以说呢，不用单独放到某一个里边对吧？好，然后呢，呃，你怎么样区分呢？就是我们的收费课，免费课呀。啊，在他的数据里边是有的啊，我们来看一下啊， 这有一个即可文档，然后找到这个查询课程啊，然后在这呢是有他的一个呃值的，比如说呢，如果你这个开传个一则代表的是免费课啊，所以来到这我们就可以写一下了， 如果说我们点的是免费课那么它的值将改变为一对吧。那当然了，最开始我们的起始的时候也要加上啊啊最开始的时候是空数据嘛。呃然后会员课呢？是这个 说这个好，下面我们再来啊，注意这都是 e 啊啊，那我就把这个数据给它一传，对应都显示数据对不对？但是呢我两个数据可能会进行一个切换啊。所以说呢我在前面呢可以先负一个空 啊，就比如说我切换到了会员再切换到了这个免费再回去，那你这免费也会把它标出一，那标出一的话就是这课既会员 课程还是免费课，那这个矛盾了对不对啊。所以说呢我们需要先把你之前的我不管有没有先给你清了是吧，然后再去做你的改变啊，做当前的改变，那这样的话就没有问题了。好了下面呢我们来试一试啊 回到我们的这个案例中。行现在呢我的课程哎刷新一下啊。呃我这呢去点击这个 view 吧啊一共是有两门课呃免费的没有 这两哎。这两个都是会员吗？哎有一个等会看一下啊。还有情况呢就是他不属于会员课程，然后呢也不属于免费课程， 它是属于单独购买的啊。是有的，所以说分为三种情况。但这样呢切换的就是会员和免费本身来说单独要购买的课呢，我们也是不建议用户买，因为那是我们自己班级的课还有些服务的啊，所以说是这样的。好，那我们就再来看一下吧。 呃点击哎你看这样切法没有问题了对不对？但是呢呃我比如说我想点击这 t m r size， 不想用这两个该怎么办？其实呢，就是点击和一级和二级啊，这个呢，有点感觉像是四级了都。 呃，什么意思呢？就是我如果说我要点击了这个一级或二级啊，这免费课程以及会员课，他们应该也要进攻的啊，所以我们把这两个 拿过来啊，往上面放放。就是如果点一姐啊，这个会员啊，免费课程和会员课程选中啊，之前数据清空啊，把它清空好，我们再来看， 哎，上去，然后现在是清空了，现在清空了，但是你的状态还没有改变啊，那么要把这个地方的一个直再改成一个零， 那这样话呢，他就谁都不选中啊，比如说先要点前端框架，不是回去了是吧？他们又回到了原来的状态，当然，呃，我们这块要做的话呢，二级应该也要做，至于三级做不做的话，大家就自行判断啊，比如说我这块也需要，那也就加着呗。啊，如果不需要就不加。好吧，这块呢，相对来说比较轻松了。哎，你看这二级是 没有问题的，是吧？只不过这个栏目下没有对应的课程啊，看会员课哎，一共有三个，然后免费课一一共有一门是吧？好，那么这对于免费和会员课程的条件筛选我们就先说到这里。
