啊,今天咱们开一节课啊,这节课可能时间会长一点,嗯,因为这两天呢,有学员在做这个项目的时候呢,他遇到一个情况,比如说这个小程序下边有个推波巴,比如说这个导航, 他想去修改这个呃,自己大小啊,或者是图片的大小。 嗯,咱们前几课前前前面讲课,咱们讲的这个推欧巴呢,他下边是在这个配置,主要是下边呢啊做了一个配置,对吧?啊,一些相关的这些这些属性啊,来来这个 渲染到前端的,对吧?这个呢属于是原生的铁锅巴的这么一个组件,那他只能是根据这个里边带的这个一些啊属性一些参数来 配置来去修改这个样式,但是它里面呢没有这个修改图标大小或者是文字大小这么一个参数的,但是这个图标呢,你可以那个如果你想改小点,你可以把这个图标呢,就是说在一些这个 图片处理工具里边呢,给他加上一个什么画布,把这画布呢周边那个这个空白的留大一点,他的图片可以缩小,但是你这个文字想要去改的话呢,他没有一个参数的设定, 但是有一些啊,学员可能说了,他里边不是有个佛德萨利的这么一个参数吗?对吧?那这个佛德萨利呢?你如果仔细看文档的看看文档的话呢,它里面有一个说明, 你说他不支持小程序,他是在这个 appappapp 和这个 h 五端呢,他会有一个啊,一个小, 咱们可以看一下,咱们可以看一下,如果咱们把这个风扇啊,把这风扇的咱们再注视掉,咱们先看一下这个啊, h 五里边的啊, h 五里边的,咱们看一下它这个是一个什么样的效果? 通过去修改这个参数,咱们可以看一下 这里边他里边有个内置,这个有点 x, 有个内置浏览器,对吧?去通过这个去看一下他这个旋转有点慢, 咱们可以看一下啊啊?这个地方看到没有?他这也是有一个给我爸的一个象,对吧? 咱们把这个风扇给他设置一下,咱们可以看一下会不会有什么变化。看这个 h 五这个 vivo 浏览器,咱们通过这个啊修改这个这个不一样的这个中端中专端的模拟器,对吧?手机设备他就能 根据这模拟设备显示出来,咱们可以看一下他这个字体是放大了,对不对?但是咱们这个小程一端呢,他还是没有变化,对吧?所以这个参数他是不实用的, 那咱们怎么去?怎么去?那个自己去定一个底部的一个推波巴呢?然后可以去修改钥匙呢? 这里咱们就需要用到这个自自定义的这么一个啊,一个知识点啊,自定义组建的这么一个知识点,咱们可能前节课没有讲这个组件的这样一个一个 知识点,这个回头咱们可以专门的去开一节课去讲一下,今天可能会用到这个知识点,不过没关系啊,先把这个原理先搞搞明白。所谓的主角呢,就是说咱们在 某些页面如果有通用的一些功能或者一些样式,咱们可以把这个组件引入进来,以后呢,咱们就省的是每个页面都去写功能或者相关的页面的样式,对不对啊?那怎么去啊?把这个样式,把这个自定义的这个 tv 八那个写在下面呢? 那咱们现在就是还讲一下,首先呢这个卡斯登嘛,这个天幺八下面有个卡斯登嘛,这么一个参数,他有一个,他默认是 boss 啊,默认是 boss, 咱们如果把它改成处处的话呢,咱们可以看一下,哎,他下边这 这个原声的这个推波巴呢?他就消失了,对吧?那消失了以后呢,那咱们就可以在里边去怎么样自定自定义的一个一个一个这个推波巴,然后去把它把这位置占用了就可以了,对吧? 那咱们现在就写这个自定义的这么一个组件,首先呢咱们在陌路下边建一个 comes 这么一个文件夹啊,然后咱们新建一个组件,这个组件的名字叫做啊,这个当然你自己随便取啊,看怎么他退不发,对吧? 啊?穿越完了以后呢,他也是生成一个这个沐浴结构啊,这个这个里边这个结构也是试图层逻辑和这个样式啊,但是 是一样的,只不过他多了一个内幕啊,这是一个组件的名字,对吧?咱们从字面意思就能看出来,那怎么在这个里边去写一个钥匙呢?在写组件的时候跟写这个咱们前前面这个页面基本上是一样的 啊,因为咱们现在是要做这个底部的一个组件,对不对?因为这个这个下面这个推波巴呢,他需要在就是在你用到的页面上的所有元素的最上方,因为他不不能被别的元素遮住,所以呢咱们就是用这个,咱们知道里面有一个卡纹 没有这么一个组件,对吧?这个你咱们原先可能没有去讲这个组件的一个,呃,一个一个功能,他就是和微友其实是一样的,他只不过他是他这个层级是最高的,就是说在里面不会被任何的一些组件 去遮挡,所以咱们用这个啊,你防止别的组织把它进行一个遮挡,对不对啊?有了靠微友咱们就可以在里边去写什么?去写这个大概的一个效果啊?你自己就是咱们啊,刚才咱们用这个原声的,咱们可以看了, 就是咱们还是按原声的啊,写这么两项的一个特步吧,啊?是图标的这种,对不对?咱们根据这个结果咱们可以来写一下,首先呢它是这么一个 还是这么一个这样一个结构的,对吧?咱们可以定一个, 咱们可以定一个这个 啊,最外头咱们定一个 fix 啊,咱们要把它固定在底部,对不对? 咱们可以叫做 tb 八,对吧?然后呢咱们可以看一下原声的上面有一个什么呀?一个一个红,一个一个灰色的线,对吧?咱们可以在这里边呢也设定一个卡网没有的那个 掏包点,这个名字咱俩自己去写就行,掏不包点, 然后下面的是这个啊, comevo 的下面的,是啊,咱们这个下,对吧? 它里面有很多的,这个有一个图片,对吧?有一个文字图片呢,咱们用卡窝一般的啊,这个是最高层级的,一般的啊,他 s 二次属性是一样的啊,咱们一会再去写, 这个是下边是文本,对不对?下边是文本,那这样一个结构咱们就写好了,那写好了以后怎么去把这个,呃,按这种就是两个的这种啊?列位这种推波这项给它输出来呢,咱们在里边呢去定一个 啊,去定一个下的一个数组, 这里面这数字里面包括什么呢?咱们其实看这个地方就知道了,其实把这个考虑过来也可以啊,把这个你可以考虑过来,咱们直接考虑过来就可以了,他就是一个像,对不对啊?这是需要的路径,对吧? 啊?在这里需要注意一点啊,因为咱们是要调用这个杯子下面的这个啊,这个图片,对吧?咱们要从根部路开始,对吧?咱们需要把这个给他加一个斜方,包括这个路径咱们都是从根部路开始的啊, 对吧?这个斜放就是直接在根部下开始啊,咱们再把这个配置再考虑过来, 涂鸦的话, 有了这个数组以后呢,咱们就可以进行一个循环,对不对?进行一个循环, 咱们就循环这个就可以了,对吧? 推啊?这是一个象,对吧?下巴是这样,这样他下边是一个象,咱们需要的还得给他弄一个小象,对吧? 对吧?然后呢咱们把这个把里边这个象进行一个循环,他一共是两个吗?对不对?咱们就是 vo 啊,这里边这个号,这个以前都是前面讲的,咱们开课的讲一个知识点,对吧?这个咱们就不用多说了, 好听吗?还是,对吧? 然后呢这里边有个还三二次这么一个数, 对吧?咱们把这个,把这个路径,哎修温,咱们把它给复制进来,对吧?咱们把这个咱们可以定一个类,也可以不用定,一会直接用 q 一边给这个标圈进行一个 复制,复制的类类的样式就可以了 啊,这样的,咱们就把这个,嗯,把这个底部的这个什么呀,这个导航的这个 两下,咱们就可以把它循环出来,对吧?咱现在还没有,咱们现在还没有去写样式,一会咱们可以先把这个组件呢先调用一下,看能不能先调出来,然后咱们再去写样式啊?再去写样式。 那现在就是需要怎么去引用?把这个组件,把这个科目测这个组件引用到这两个页面当中,因为你就两个页面都需要用到这个指定组件,对不对啊?咱们运营组件的方式也很简单,咱们就跟其他饮用方式是一样的,对吧? 咱们这个地方呢,就是啊,嗯, 把这个自己去定定一个名字,然后把 from, 对吧?敲门斯卡斯,对吧?然后呢这个地方呢?这个地方有微微也行,没微微也行啊,然后咱们把这个敲门, 把这个 pasta 引入进来,然后这样的话呢,咱们就是这个左边的一个引入,引入就完成了,但是咱们要需要把它渲染在这个石头层上,对吧?那咱们把这个标签呢,就把它写上来就可以了,你这样的话呢, 这是其实这个地方就是调用在这个地方,对不对?内蒙下边,那咱们看一下,咱们已经把这个引入进来,对吧?咱们看一下能不能实现这个实现这个引入效果 啊?没有找到,我看一下啊, 他这个提示说主角没有找到,咱们看一下 看是不是缓存的事,是怎么回事啊?刚才是缓存的事啊?啊?咱们现在就把这个图片引进引进来了,对不对?咱们看一下这个图片为什么没有显示啊? 啊?真把这个弄错了, icn pass 对吧?这个地方是 icn pass 啊,然后这个这样,这个左右加入进来了,对不对?看到没有?比如说咱们已经 成功把组件内容引进来了,对不对?刚才为什么说了个叉,重新重新保存了一下?因为刚才他那个组件可能是因为缓存或者什么相关的,他没有加,没有那个 编译,编译成功还是怎么回事?咱们重新再保存编译一下。嗯,然后呢,咱们既然引进来了,咱们就需要把这个样式调一下,对吧?那咱们先把这个自定义样式开启,也就是把原先的原声的原声的这个给它关闭掉, 关闭掉以后呢,咱们需要把这个样式呢进行把这个这个这个自定义的这个样式呢给它放到底部啊,为了这个方便调试呢,咱们可以在这个啊,在这个什么,在这个面印者开发工具里边, 咱们直接调试就行了啊,但是呢咱们这个地方还得还得给他写一个样式,要不然一会不好调试,咱们直接先先把这个样式先给他加起来, 咱们这是这个 对吧?然后第一步 啊皮肤,然后呢这有个头有个 q 八,对不对? 有个淘宝的 这个钥匙在,他自己去洗啊,到时候去调试就可以了,然后还有这个 啊,然后里面有一个什么像冰腾,对吧? 然后呢啊?有这个以后呢,咱们可以 啊,咱们大概写了一下,写了一,写了一下以后呢,咱们的话呢,咱们就是把这个样式写好,对不对?把样式写好了,然后咱们咱们 去看一下这个效果,从这个这个微信开发者工具里边去看一下啊,对吧?咱们通过这个页面再进行一个调试,一个调试,首先咱们看一下啊, 这个地方写错了,然后这样他就固定在底部了,对不对啊?因为咱们需要给这个, 给这个考,你们,你们这下面这个给他设了一个,设了一个大小 二七 七, 然后这样的话呢,这个这个地方呢,咱们就可以看到啊啊?他已经跑到底部来了,对不对?咱们再给他设置一个在这边再给他调调一下,调一下 这个微信者开发工具。最近这个调试呢?他怎么老是出, 出那个书的时候他老是出问题,不过这没关系啊,这个咱们就只能慢慢调了, 这个一定要学会调试啊,要不然你在小程序里面开发一次,再渲染一次,就速度就非常慢,对不对啊?这样的话呢?他就出现了一个什么啊?看到没有?出现了一个 啊,大概的一个底部的一个效果,咱们可以把这个地方再调一下。嗯,今天 不调的太太太精准了啊,因为咱们只是一个演示,只是一个效果。然后呢?咱们把这个调好了以后呢?把这个地方 把这个地方调一下, 这个地方需要写这个样式效果,自己去调就可以了。 它是一个什么呢?里边是一个垂直性的,对吧? 他这个调试器有时有问题,我不知道是我这个电脑的版本装的这个版本的问题还是怎么回事? other 可以看一下啊,这样的就实现了一个这样一个大概的一个效果,对不对?那咱们把这个,把这个 这张修改好的这个样式,咱们考到这里边,考完了以后呢,他就是咱们调试后的这个效果,对不对? 然后呢咱们可以给这个图片呢,给他加一个周边的编剧, 这样的话呢,就看出来就更好看,更美观一点,对不对? 然后那个 咱们这个地方呢,就是说,呃,还要跟原声一样进行一个点击的话,进行一个样式的一个切换,对吧?为了方便呢好看呢,咱们把这个原先的这个样式呢,把它再给它恢复了, 恢复了他现在咱们这个地方在切换的时候,看看他这个图标和这个文字啊,都有一个变化的一个效果,对不对?那咱们怎么去把这个 图标的效果也有一个效果的变化呢?咱们可以这样啊,因为这个呢,咱们上节课上个视频,那个 随波再讲的时候啊,他也是利用了这个切换的时候,他会根据你选中的不一样的这个向往的一个变化,咱们上级各大会讲了,对吧?其实他的原理也是一样,咱们设置一个什么呀? 记住啊,这里边啊有一个有一个问题啊,这是一个组件对不对?咱们需要在外部也就是说在这两个页面去操作组件里边变换的值, 对吧?所以咱们在主页里面去写的情况下,咱们需要写一个, 写一个什么?写一个外部能够控制这个,也就是这个副组件能控控制这个子组件里边的一个一个一个属性,对吧?那咱们需要给他用一个 probs 啊,这样一个啊,一个一个定义的这么一个 一个一个直,一个直吧,这样一个参数需要设定这个,呃,比如咱们要看的这个是咱们以后啊,咱们可以以后去讲这个是什么?这个这个组件里边去怎么回事啊?因为他需要传,传给残值,对不对? 第一个 number 的一个类型 the boss 呢?咱们就是设置为零啊,这是定义这个,那就是操作这个子组间的这么一个格式啊,这个去记住这种格式就可以了。 但是他在引用的时候呢,咱们在这个适适合层里边引用的时候呢,跟在这个定义在对策里边这个是一样的,是一样的啊,所以咱们这个地方呢,就是说如果你今天切换的情况下怎么样这个地方就是说 需要做一个判断了。首先呢咱们定义了一个 curnt, 对吧? come 他等于这个 index, 也就是说这个 comen 在变变化的情况下,他等于一,等于二的情况下,他只要等于,因为这个应该个词的循环吗?零一这么一个循环,对吧?如果等于零的时候,他就是说明在第一个 这个推过八项上面对不对?那就是那就是怎么样?切换到这个选中项,对吧? 激光的这个选中像,对不对?同理你下边这个也啊,同理你下边这个太个词也是一样, 咱们定义了一个泰克斯啊,定义了一个泰克斯,对吧?这个泰克斯咱们现在没有写样式啊,咱们现在总理还是按 上节课讲的啊,咱们定义这个 ac, 对吧?激活这个像,对吧?也就是说咱们在当前这个像的情况下,他这个要给他一个当前的一个像的,一个什么?一个 一个类,一个样式类,对不对? 好,咱们看一下啊, 这个地方丢了一个逗号,然后咱们看一下啊,因为你这个卡没有啊,也就是 看到没有,你没有一个定义,对吧?咱们把这个太子,把这个太子子定进来,给他一个样式的一个样式样式类型,对吧?咱们直接定义的 ft, 咱们把这个颜色设置为红色 啊,这样的情况下,咱们看一下这个效果 啊,这样的话他就变成一个红色,对吧?咱们把这个维勒和圆效果一样,咱们把这个 agtium 定义,为什么呀?定义为一个蓝一个蓝色 啊?这样的话呢?咱们就切过来了,对不对?切过来了,那怎么变成第二个呢?在第二个切换的时候怎么去操作呢?那肯定是咱们也需要给他一个复制一个事件,对吧?点击的时候的一个事件,对不对? 咱们看一下,咱们给这个像啊,给这个里边这个特步像呢?一个是立刻的一个事件,对吧?咱们是四位置,这个名字也是自己去定义的,对不对? 它里面有个什么呀?有一个音响,对吧?音响下面有一个 pass, 对吧?咱们需要跳转这个相应的页面,那咱们把这个方法呢? 把这方法写进来,他这里边带了一个参数,对吧?配,咱们就叫配置就可以了,这个参数自己去命名,为什么?咱们要记住一定要随 随便去推波,对吧?因为他是推波巴的,一个一个一个放在这个推波巴里边下边的,咱们以前讲过这个页面切换的时候,是吧?怎么样?用这个 用这个哪个哪个跳转看一下,咱们看一下啊,这现在是首页设置,对吧? 啊?咱们现在就跳到这个,我的这个这个像这个页面来了,对吧?但是你跳的时候为什么这个这个没有了呢?你自定义那个他也不发没有了,因为你没有在这里边去 引入这个组件,对不对?那咱们就需要把咱们定义的这个,把这个组件引用一下, 跟那个跟首页的那个引用的方法是一样的, 这些格式啊,都叫记住这些都没有什么,为什么?他就是这种格式去去用去引用的,你要不知道用格式去引用,他就引用出来,当然还有其他的方式,其他的格式去引用啊, 咱们把这个用进来,咱们看一下效果 好。哎,你在切换的时候是不是切换到我的了,对不对?但是你下边这个颜色值并没有变化,对不对?那这里边呢?咱们需要 在本在这个卡斯城自定义的这个组件里面进行一个逻辑上的一个切换,对不对?那怎么去? 嗯?去切换呢?这里边咱们定义了这个 colon 的,对吧?咱们只需要改为 colon 的值就可以了,对不对?只需要改成 colon 的值,因为你外务改了这个 colon 值等于零的情况下,他就是零,等于零,他都会切换到第一个项,第一个项目,对吧? 啊?如果你是一等于第二个循环的,你大夫他有前后的第二个,对吧?所以咱们把这个康的直进一个变化就可以了。那怎么去进一个变化呢?咱们把 把这个 probs 在这个组件里边来定这个属性,对不对?那咱们从外部这个从外部副组件这样去去变冒号 come, 然后这个 comen 就是你自定义的这样一个属性, 对吧?咱们给他设成零,因为你这个当前页这是属于是第一个页面,也就是零,对吧?然后太子你是第二个页面,你就给他定义成一,对吧?这样的,这样的话呢,这个 car 呢?他就有一个变化了。然后咱们再看一下 啊,咱们进行一个切换啊,这样的话呢?可能就进行一个切换了,对不对 啊?这样的话咱们这个自定义组件,咱们再把这个,最后把这个组件给它隐藏掉,然后就是把这个 这个一直在开启 啊,你这样的话不就实现了这个自定义的这样一个操作了吗?对不对?如果你想改这字体大小,改这个文字眼,文字体的颜色大小 或者什么的,你直接就直接就可以在里边去修改就可以了,对不对?比如你改成三十 啊?你这样的话你就可以进行一个自定义了,对不对啊?这就是这个组件的咱们一个一个操作,对不对?组件的一个操作。嗯,今天的课程。
粉丝102获赞389

今天来讲一下小程序中不同权限下加在不同的底部菜单。为方便展示,小程序中间空白部分被我拆掉了。首先看到的这个底部菜单是普通用户看到的,打开个人中心界面,右上角我加了一个切换按钮, 点击过后底部菜单发生了改变,这时候看到的是管理员权限下的菜单栏,当然在实际业务中得加认证权限,我们也可以根据情况随时点击切换按钮来切换底部菜单。废话不多说,接下来讲一下这个是怎么实现的, 原生的菜单栏肯定是做不到的,这里我们用到了自定义踏板,这个自定义菜单栏必须放在根目录下,文件加名称必须叫这个。我们在 index js 这个文件中先把所用到的菜单数据写出来,上面看到的这部分 代码是普通用户所用的菜单数据,而下面的这部分代码是管理员所用的菜单数据,通过判断这个全局变量来控制显示哪一个。另外我们还要去全局配置 up 点衬中启用自定义踏板,就是现在所看到的这部分, 其中这个就是启用配置。后面这部分是声明哪些页面属于菜单页,其他字段可以省略,页面路径必须要写。还有就是只要是菜单页,在 onload 函数中必须加上这段代码。都看到这了,点个赞再走呗!


好,那么我们刚才已经把我们这个 terrible 它的这个基本的这个使用咱们已经搞定了啊,相对来说还是比较简单的啊。那么咱们这个完事之后,咱们再去把我们这个 terrible 比较常用的这个几个属性再来去简单看一下啊。 那么来看第一个就是咱们这个卡拉,那这个卡拉有什么作用啊?咱们看一下啊,我们现在这个未选中的这个首页,它的这个文字是不是灰色的呀,对吧? 那么我们就可以通过 color 来设置咱们这个未选中的这个文字颜色,那么这会要注意啊,看一下这个文档啊,这个 color 是属于谁的呀?来看这个 color, 它不是属于类似下边的吧,它是不是属于咱们这个 tableboy 下边的呀,对吧?所以说那应该在这个类似同级。咱们来一个 ceo 卡罗拉卡了。那么这个 颜色值咱们来看一下是什么样的啊,能不能写一个这个英文的单词啊?看一下你看他是不是只能支持这种十六进制的这种颜色码呀,对吧? 好,那这块我这块有,咱们这个来看啊,有这个颜色查询表,咱们找一个啊。行,就换成未选中的,咱们来一个暗色调的吧,对吧?未选中来就用这个来, ctrl c 复制一下,这我是随便搭配的啊 来,那么 ctrl v 在这块加上一个井号啊。好,我们在这来测试一下啊,看一下我们这个未选中的这个颜色能不能试试啊。 稍息。来看这一位来看未选中的这个文字颜色是不是就变成了这个颜色呀,对吧?那么接下来我们再来去学习另一个属性啊,来哈勒就搞定了。 同样的,还有一个叫做这个 sike 的卡拉,是不是选中之后的这个文字颜色呀,对吧?我们把这个再来配置一下啊,那也是一样的,你看他也是支持这个十六斤制的这种颜色值的啊。好,我们在这去选择一个颜色值啊。 来,那么我们就来一个这个亮绿色吧。把 ctrl c, 然后给它拿过来角 ctrl 杯测试一下。 好,我们来看一下这个可不可以啊?稍等来看。那么你看未选中是不是就这个颜色?选中之后是不是就这个颜色呀?快来,我点一下首页哎,你看是不是 ok 呀,点我们信息是不都是可以的,没任何问题啊。 行,那这样的话咱们这个 selected color 也就 ok 了啊。那这个 byground the color 这个就更简单了吧。就这个就是来设置背景色啊,来,我们 测试一下来。那么咱们把这个背景色也去给他设置一个值啊。来,我们在这给他设置成一个这个紫色吧,对吧?击老紫 来点看着微保存一下保存。咱们在这来测试一下。稍等来看是不是就变成了一个紫色呀。哎呀,真是丑啊,太丑了。可能是我的这个美感不是很好啊。那么咱们看小程序是不是也变化了。可以了,像呢,这个也就是咱们的这个。这个白图上的卡卡 除了这个来看还有哪个属性啊?还有一个这个 bard style。 那这个 bard style 他来看一下,他是来设置什么啊?来看,他是来设置咱们这个上边框的颜色的,你看他是是设置上边框的颜色。什么意思啊?看着啊,我们现在这块其实他是有一条上边框的,看着可能不是很明 明显。这样啊,我们把这个背景色改一下啊,改成咱们这个白色,咱们来看一下啊。稍等啊,我们在这刷新一下。你看这回就比较明显了吧,这边是不是有一个这个黑色的这个边框呀,对吧? 来,那么这个边框我们就可以通过这个包的 style 去试试啊。那你看他只是只能支持两个词啊,一个是 black, 还有一个这个 red, 那么他只能支持这两个颜色啊,但是你看他在这个 app 二点三点四上,他是可以支持这个其他颜色的啊,这个咱们知道就可以啊。 好,那咱们在这块在这去设置一下啊,来设置一下我们这个包的 style, 然后去给他设置一个这个白色是吧?来,咱们看一下这个白色 whip。 好,我们在这测试一下啊。保存 保存完事之后回到这个里边给他刷新啊。你看这一位,上面这个边框是不是就没了呀,没了吧。哎,咱们看一下这个小程序也是一样的啊。 交纳这一个,也就是咱们这个 both style。 那除了这个还有一个这个 position 啊。那这个 position 要注意啊,它这个值来看它来看 top 值,仅支持这个微信小程序。什么意思啊?你看我们在这设置一下你就知道了啊, 给大家一个 pus i t l n 对吧? position。 然后给它来看啊,它的默认值是 bottom 啊,也就是它是一个底部的这个 table 栏。如果给它改成 top, 咱们先来看一下这个微信小程序啊,你看他是不是变成了一个这个顶部的这个贴布栏的呀,对吧?并且咱们之前也说过啊,如果 position 设置为 top, 图标是不是就没了呀?哎,图标就没了。行,那么咱们来看一下浏览器中可不可以呀,浏览器上是不是不可以的呀,对吧?所以这个要注意啊,他只能在这个小程序中 起作用啊。行,那这样的话,咱们一个关于这个 keyboard, 它的一些配置,咱们就学到了这里啊。行,那就到这里了啊。

啊,现在我继续讲这个,上次做了这个怎么出来哈?选这个问题哈,这个是在做这个出来之后,其实我们的比如这个是主页啊,然后我现在做主页, 然后这里是啊,日字啊,好,现在我为他加图标,因为一般呢,我们像这个这样子,他就会加图标的,而且图标还有两个两个问题啊,你点下去,他是黑色,你说 当不选中他是这样,就说明他有两个图啊,比如说要准备两个图啊,我现在先做第一个,那这两个图了,我就去网上找啊,去阿里的图库里面找啊,比如叫啊首页啊后吗? 然后就写,随便找一个吧,就这个,然后下载下载一个图哈,因为两个图呢,一个是什么色?比如一个是红色啊,这种粉红色 下下来啊,这是一一张图。那你还要下第二种颜色的啊,这个颜色一定要也要下是不是?那我们再下第一张这张啊,当你可以下其他颜色。 好啊,这时候拿的这两张图啊,不是一张图啊,这两张图还有两张啊,复制过来啊,完全复制之后我放哪里去了啊?肯定要放在项目里面啊,这里 我建一个位置,建一个目录啊,建个目录,建个目录,在资源管理器里面建啊,打开之后把图放进来啊,一个红,因为两个颜色不一样哈,所以呢,我就写一个红衣, 一个红二吧。好,去看一下这个项目里面,那么还有个日字,是吧?日字也要 这时候看到这个点下去啊,这个是灰色的,而这个啊,这个是粉红色的。那我还有一个,除了这个这个之外哈,我还要,不是还要吗?还会日制吗?是吧,那我要 搜索一下啊。好,这里有个是不是随便找一个啊这里啊,这也是有一个是吧,要统一一下嘛。好,灰色灰色。刚才是选哪个忘了,我现在就随便选一个吧。 啊这做栗子啊。好,现在拿过来这两个是也是要有啊啊也是放,拿来去 同样道理也是在这里放啊好,这是日字是吧啊放这里还是两个啊在这个是 lo 啊。 log 不要用中文啊, 就算中文。因为编程呢有一种思维方式叫 lgs 吧。啊,这里也是一个一是吧这个是二吧这个是一 啊,这要要把它改一下同一个名字好记啊。哎,这里点错了。 l o g s。 好,这时候怎么放进来啊这两个已经准备好了这是放进来放进来肯定要找代码去啊啊自己啊,去找代码哈,找一些代码看哪里有啊这里有有啊,这里有两个,你说历史这个哈,这里 我反而在这里又没找着这里在什么地方这里没找着啊,别的其实一开始了我要想找这里他这没写要有啊,这少了两行字, 当然这个是可以拓展哈。拓展你说你不需要就他就不留啊,不提供吗?好,这里什么意思,就把它复制过来吧。啊,这里很像是啊,要怎么放呢?你拿到这里就拿到这里 这个菜单这个地方啊,好,导航这里地方前面找个复制的东西把它删掉啊,我们根据全其他。好,这里的是什么?还有 ags 这个后面呢,你要写上这个。好,这个是 home h o n 我是什么拓展名? h o n 一 那么这个呢? hom 二是吧一二好,这里发现这个图,当我点下来好,点下来才九九,那么这个呢?同样道理,我这个也配上, 因为这时候你看不出来的啊,然后 l o g l g s 保存一下,好,这时候你发现我选了哪一个?其实我选这个,是不是你点下来,其实是已经点中了啊,我点这个哦,被点中是灰色啊,这样好像有点不太对哈,知道不?我就要反过来,是这样 啊,这个是二,这个是一,这个是二,这个是一,好,保存下啊,被选中的是红色,粉红色, 好,就这样,哎,这样就就比较正常,是吧,给人感觉比较正常,所以我们这个颜色怎么配呢?我们自己有个概念啊,这时候基本上这个图标呢,就上去了,而且一定要两个图标啊,我觉得这里的这样做了可以实现,基本上可以实现,那么这边他可以加多少个呢? 比如说这里这里可以加多少个啊?加,假如这样子啊,你要加多个,不是这样复制粘贴吗? 这第二个,第三个,第四个好,保存下就可以加六个,看到没有?他可以加六个,但是六个你要对镜不同意啊,才有用啊,如果是同意也没必要这么多,我这里做个例子来这样讲啊,就说你可以复制粘贴,是不是提供六套的图标,那么可以再加吗?啊,其实 他是有限制的啊,来,再来七个行不行啊?七个上不去的,他说这里不能超过五项,是不是总共是五个就就到顶了啊?但是我们要多怎么办?两排怎么办 啊?如果有些是两排图标的,那怎么办啊?后面我再讲啊,用这个技术来做啊,导航,而不是用他这个,是吧?这样就可以实现的。怎么样做导航都可以啊,咱这个也是非常有用的。

哈喽,大家好,我们全天开发云,下面我们讲一下开发的配置的第二个部分啊,就是我们要配置一下 点击事件,就是比如我点击哪一个按钮,太破伴的按钮,然后去跳转到哪个页面,怎么做呢?首先我们切到这个开发工具哈, 移动端组建这一块,然后我们去啊选择一个胎压罐,假设是民宿胎压罐吧。 然后这里边的话,我们要跳转页面的时候,我们需要在这里边 指定内容里边做一下配置,看到了吧,这就是我们点击完之后呢要跳的一个页面,就是太本一, 然后试验类型的就是 ctim, 是一个太部类型的跳转,但里边是支持一些 参数块位,里边可以放参数。首先我们要放的一个是 appid, 然后 apid 就是根据我们页面的一个 id 来算呢, 然后一个配置 id, 我们来看一下 apid 和配置 id 在哪啊。首先我们看 appid, 点音乐移动页面的开发这一块,然后我们看 民宿吧,然后民宿的这个 app id 就是民宿的这个 id, 看到了吧,是这个三十二,然后首页的这个 id 就是 配置 id, 这个要搞清楚啊,这样的话我们配置完之后点击这个按钮的时候,点这个按钮的时候他就会切换了, 就切换到这个页面,当然我们这几个页面是预制好的,然后是通过那个 app id 和配置 id 进行一个切换的。数据装载是这样的一个模式。

好,上节课呢,咱们做到了退出登录这一块,那么这节课呢,咱们要做内容啊,是跟他这一样点击我的或购物车呢,他可以进行一个验证,对吧?如果说登录了就进正常的进入这个页面,如果没有登录呢,就弹出来这个登录这个界面。 而咱们现在做的这个东西呢,是就用我的,咱们需要点这个头像,对吧?那本身呢和咱们这个目标 app 呢是不符的。好,那所以说呢,咱们这一课把这个问题修正了, 那首先呢在这我需要给大家强调一点啊,就是说大家看一个问题啊,当我点击我的或者购物车,那么 他是进入到了我的里边进行验证的,还是说需要拦截,就是没有进入到我的,他就验证啊,那一定是没有进入到我的,就说我点击是我的,在这个进入页面之前,他要做一个事件的拦截啊,验证我到底是否登录,如果登录那么就这样显示,如果没有登录那么就显示这个页面,对吧? 啊?那但是呢在 uniap 里边啊,它这个,呃原声的这个 tiger 这个导航底部这个块啊,它呢是不能做事件的一个拦截的。 好吧,大家可以看一下 a p i, 它是不能做的,这块要做的话呢,只能说你进入插件,或者说啊,咱自定义,当自定义呢,也有很多方式 啊,这呢给大家强调一下,有些插件他其实一个问题啊,我觉得这块自定义是最靠谱的了,好吧,所以说在这呢,咱们需要把之前这个胎把呢给他删掉,那咱们需要自定义在这呢,后续有可能咱还要用到其他东西啊,所以说我把这个胎把啊给大家先注定好吧,后面呢,咱们难免会用一下它里边这些图片入镜啥的啊,注意掉 出道以后呢,咱们这个项目呢,就是没有 tiber, 大家可以看一眼啊,回到我的项目里边,大家看是不是这一段空白啊? ok, 那现在呢,我需要自定义 tiber, 那咱们到这 capanese 里边公共里边新建一个,呃,文件,咱们 叫 type。 好,咱们实现这文件以后呢,咱们需要在哪个页面去引用它呀?哪个页面用咱们就在哪个页面去引用。如果说你让全局都使用,可以在魅点 gs 里边去用,那魅点 gs 里边如果引用它了,那所有页面都会有 type。 好吧,那在这呢,咱们需求肯定是只是首页购物车我的和分类这块要用,所以说我需要在啊,咱们这个每个,比如说 index 打开, 在它里边去引入这台板。好吧,那每个页面都需要这么做啊,来 type bar from, 然后 type bar。 好,大家都需要在哪几个页面啊?我把这句话复制一下,需要在 list 也需要这样写,我在这加一条,对吧?需要在咱的购物车页面也需要加,我在购物车页面加一条啊,需要在我的页面加,咱们需要在我的页面里边,哎,加一条。好,加完这一条以后啊, 咱们需要在 capanise 中呢,在那个地方呢,去把它用上,对吧?哎,这个页面没有 capanise, 在这呢,咱们写一个用一下它,包括呃购物车也需要加,包括 list 也需要加啊, index 当然更需要加了。 好,加完以后咱都知道要用它,那我会在每个页面最底端啊,把这个踏板拿过来,然后这样呢,我可能会传参数,比如说传一个 carry, 呃,咱们的 carry 的配置吧。 啊?有可能会传这么一个东西。然后呢,咱们后续,呃,比如说首页点击了,如果等于这个 color, 等于这个 index 了,那咱们就让它干嘛呢?选中,对吧?哎,就查到这意思好。然后呢,咱们需要,呃,在这儿, 也就是 list 也需要加一个拧过来,这儿呢,就是 list 好, sharp car 这儿也需要加 好,我的页面也需要加好了。 那么这个胎把咱们拿过来以后啊,拿过来以后,下一步咱们就需要在里边去布局了,对吧?首先呢,我来个六 class 呢,咱们就要胎把吧,行吧。然后,呃,咱们肯定要布局去写数据,行,那我这呢先去写一个数据,然后上面呢,咱们循环就可以了, 这个别删。刚才那个,呃, pace, 就是说咱们可能会用这里边东西啊,把它打开一下,或者说我把这里边这四个对象啊复制一下,因为咱们还是这四个东西嘛,对吧?来打开, 还有这四个东西好,只不过这四个东西呢,要放到一个,比如说 type, bar, list 这么一个数独里边好了。然后路径呢,咱们就要改一下啊,要不然他就找不到了。好吧,咱们直接从根部 下的 satik 下出发,去找这个图片路径就可以了。呃,然后上面这个路径呢,咱们简单点啊,咱们这呢,因为后面做判断,所以说我直接写成这个 index 就可以了,这直接写成 list, 然后这样呢,直接写成烧烤,这样呢,直接写一个卖就可以了。好,基本上差不多这个样子好。然后呢,这是一个复元素,那这个复元素呢?下面有子元素,比如写一个钛,他需要通过 v 杠,呃,意,呃, v 杠是这个 for 去循环。啊,这样呢,咱们可以写一个 action, 逗号 index, 印一个说,呃,这个 type type bar list。 好,这样呢,有一个 pay, 等于 index, ok, 然后在这里边儿呢,可能会有一些图片儿,对吧?比如说咱们呢有选中或者未选中的图片儿,那这儿呢,咱们可以直接直接这么写了, atm 到上来都是未选中的啊,然后 下面有一个 view class 给个名,这里边就 attempt text, 就这个名称吧,是吧?然后下面呢,咱们去写一下它的一个样式啊。 好,呃,首先呢,咱们需要把这个东西固定在最下方 left 零,呃, bottom 啊,零就可以了。好,宽度值百分百,高度值一百二 r p s。 这是我建议的。 ok, 嗯,然后咱还需要写什么东西啊?嗯,我这看看啊,咱还需要写的是让里边元素呢?打开 display flex。 好,嗯,垂直居中。好,这是咱们四个内容。好,现在呢,咱们先,嗯,看一下。不行,因为这个图片有点大。呃,这样,我把这个图片绘制一下。 呃,宽度值我给个四十 r p s。 高度也是四十二 p s。 好吧,然后咱的文本颜色这个颜色就不给了,文本的这个 phone set 我给个二十四 r p s。 ok, 然后它是上下的一个布局,所以说我给这个 tag 要加一个 display flex, ok, 让它各种剧终就可以了。 好,然后呢,咱们加一个上边线,这样呢,加一个变颜色吧,最好。然后 z e x 也加一个 啊,避免它在别的元素下边。 ok, 然后 order the bottom 二 r p s 实线。好,这个线条的颜色呢,咱们就取那个默认值,对吧?这个默认值这个颜色好,行,下面呢咱们看一眼啊,它是否会有? 嗯啊,这儿的牌子不对啊,应该是 felix direction column。 啊,好,咱们再来看一眼, 是吧?差不多这个样子啊差不多这个样子。如果说大家需要调整样式呢,就是正常去调,没什么太多区别。好吧,正常去调就可以了。 ok, 比如说你希望的话,呃,他有个判定值,那上下来一个十 r p s 左右零,这都可以。 好,这块呢就由大家了啊,我这就不去调这个样式了,差不多就这个样子就可以了。好了,嗯,现在呢咱们要做的是什么呢?选中和未选中,对吧?并且呢有个跳转页面啊,咱们先把这个选中或未选中,这个图片文字咱们颜色不需要动,对吧?图片呢,咱们需要切换一下, ok, 那我这儿可以写两个引位置,做一个判断就行了。好,呃,我上来呢,先去判断他选中的是否选中,如果不选中再去走这个。好,那在这呢咱们如何判断啊?啊,咱们可以这样去做,就是谁显示或不显示嘛,没刚意思对吧? 如果说我 atom 的这个路径等于了啊,我这用的时候传过来的,不是传那个 current 配置吗?对不对?那我这儿呢肯定有个 pros, 然后 current page, 呃, type 类型呢?是一个 stream。 好,默认值, 默认值呢,就是咱们首页就是 index, ok, 这样做就可以了。然后,呃,咱们要去做一个,如果说他等于了,对吧?默认等于 index, ok, 就选择他 v 账 as, 否则就就是这个东西好,基本差不多, 咱们再看一下,你看上来这个首页呢,是选中的,对吧?哎,上来是选中的, ok, 那这块呢,咱们就算走通了啊,这块就算走通了,但是呢,现在我点击切换不找页面啊?切换不找页面,那咱们需要给哪个地方加一个试键,对吧?比如说我要 点击的是这个外层,我需要给他加一个时间,等会啊,我把这排一下,走走走,好,加一个时间,比如我叫他 nanvy, 呃, get to 吧 two 啊,然后我去需要把这个 atom 的当前那个值传过去, 当前你是 index 还是什么,对吧?是 leads 还是什么?然后呢,我再把它的这个 index 值就零一二这个传过去,我看看啊,咱们零一二其实不需要了,我想想啊,咱们这样呢,可以这么去做,然后这样呢,有 item 的他好,咱们通过他就可以判断了,所以说不需要那个 index。 好,那下面呢,咱们就写一个 number two, 来到下边, 我不是传了一个当前,你是 list 啊?还是说卖呀?还是说这个?呃, shop car 呀,这样东西对不对?那这儿呢,咱们有个亿,我把这 记得打一下,你点哪个,他就会打印出来哪个,是吧?我点,比如说购车,他会把 shopk 给我打出来,然后点下购车,咱们看一下,对吧?我点下,我,你看点一下这个分类, 是吧?他会有这样东西,那所以说我在这可以做验证啊,对吧?比如说如果 e 等于了,咱们都会验证哪个呀?是不是我的页面还有哪个页面是不是购物车啊?那咱们先写购物车吧,避免单词写错,复制一下我或者咱们 e 等于了这个购物车, 当两个等三个等都无所谓。那咱们需要干嘛?咱需要呢,去验证一下,对吧?咱需要去验证,那这样呢,咱们就要 ctrl clog 了,验证一下。 好,否则 s, 那否则的话咱们就跳转呗。 unit 这个跳转,跳转,这儿大家一定要注意了, 我给大家说一下啊,咱们这个跳转应该写 number two 啊,什么东西?注意 number two 它的意思是什么样?意思它会有返回,也就是说它不关闭其他页面。好吧,那所以说咱们在这呢不能用 number two。 来,我给大家看一下 api 啊,咱们到跳转这块 好,页面跳转这块你看啊,我这呢先用一个 nike two 啊,跳转,这就很简单了,右下右,我这写成 e s 六吧。然后这个路径是什么?是不是跟咱们之间那个路径一样,对吧?你用这个路径对不对?咱们只不过这样呢,需要加上点点杠,点点杠,然后配置是怎么回事?但是这呢就不能写死了,咱们应该写的是 e, 是吧?差不多这意思。好,你看啊,现在如果我用 nana get two, 咱们来跳软,你看啊,刚现在我点这个购物车和我的,这是不对的,等会我把这重启一下。好,你看啊,现在如果说我点 分类点一下,你会发现分类这多了一个返回箭头,所以说这呢是不可取的,那在这怎么办呢?咱们啊,回到这里边,你看啊, number two 代表意思是保留当前页跳完的某个页,也就是说他会返回,因为他要保留当前页,因为你要有可能返回到上个页面, 对不对?哎,他这么个意思。好,咱们再来看下一个关闭当前页漂亮的某一个,咱们用的就是他,好吧,咱们需要把我之前那一面呢关闭了,所以说呢,咱们需要用这个方法,咱们再来试一下, 大家看。呃,我切换到这,大家看啊,现在我去点分类,你看直接跳转到分类了,然后上面并没有,那返回我再返回到我的首页,你看这样是没有问题的,对吧?而首页这有一段空白是原因,咱们到 index 这一块儿啊。呃,咱在取壳区域的时候,这儿呢有一个八十,把这八十取消掉就可以了。 好,再来看一眼,好,回到我的项目里边再看,现在就 ok 了,对吧?我把这重启一下,咱们再来看一下。 好,现在进来以后,这是分类购物车,我的对不对?然后点击分类可以进来,点击这个首页都没有问题。大家点击了购物车以后,他会打印,因为他现在不会跳转在打印验证一下,这要验证,那验证这呢,咱们需要去写个逻辑进行验证,咱们这个部分呢,放了下节课,这节课呢,咱们在这呢已经可以做一个验证了, 对吧?只不过这的逻辑咱需要写还是可以了。好,那么这一课呢,咱们主要是把这个资金胎棒这个样式给他完成了啊,包括再说一下之前咱们写过很多的这个呃跳转,咱们都写过哪个跳转?比如说有这个他,对吧? switch ta 这么一跳转,那之前咱们写这个跳转都是现在不能用的,所以说咱们需要替换一下,好吧,那这个呢,咱放在后面去替换。行,那么这节课呢,咱们先说到这里,下节课呢,咱们把那个呃验证给他搞定了。

hello, 大家好,我是清风,上一期呢,我分享了六款我最喜欢的软件,然后其中有一个软件会比较麻烦一点,就是 qt tabar 了,所以这一期视频我就来讲一讲这个 qt tabar 的入门。 这 q t 跳霸呢?它安装完之后呢,可能大家还不知道它怎么在哪里,怎么用,这个时候我告诉大家在哪里 安装完那个 q t 跳罢之后,那打开这个资源管理器,然后点一下这个查看,然后点一下这个选项,这里 点这里点选项两个字,这里不要点上面这个图表了哈,点点下面两个字,然后它就会出现一行,然后你就勾选这个 q t tabar, 然后它就会出来, 对,他就会出来,出来之后他本身他本身是一个英文的,那我现在是做了一个, 哎,汉化,其实不是我做啊,就是网友,有网友把这个汉化的那个翻译发到网上,然后哎我就会去下载一个东西,那那等一下我也会把那个分享给大家,大家不用去找了,其实我找了蛮久了,汉化的那个流程就是右键,在这个 呃标签栏那里右键,然后选一下这个倒数第二个,倒数第二个,然后他就会进入这里,点一下第一个,然后在这里是他可能会显示 language fields, 他让你选一个语言文件,大家就就就就看着这个图 知道在哪个位置就好了,然后呢就点这个选择文件翻译的字幕放到哪个地方,你就点哪个地方,你就选中它,然后打开,然后呢就可以一点应用,然后就点确定,你再把它关掉,然后再打开 它就会显示成中文。好吧,大家如果想设置说每次打开让这个标签栏都能够自己自动打开,那么可以自己先打开几个窗口,然后就把它们编成一个群主,知道吗? 就可以这样子为为活动标签页创建群主,为所有标签页创建群主,创建一个群主之后这有个群主列表,看到没有这个星星,这里有个群主列表,然后点一下这个主页,你你你可以把你的主命名,我这里又没有,懒得命名我就。 所以你可以把把你组命名之后找到你想要的那一组,比如说我这是一组,就是我就是我每次要打开的这一组,然后把这一组选中,选中完之后这里有一个启动群组, 这个就很方便,像那个浏览器一样,哎,你设置这个启动页就很爽。好吧,好的,那基本的功能就这样子了,其他的还有大家想想怎么搞怎么搞,这里还有很多功能,我我我就懒得去研究这么多,我目前就 就就其实用用它的这个标签来用的比较多。哦,还有一个,呃,它有一个预览的功能,就比如说它可以预览, 对不对?它可以预览视频,也可以预览,然后图 变预览,预览,呃,这个预览呢?这有个预览提示啊,哎,不对,对,这有个预览提示, 他默认是就鼠标放在哪个地方,他就会自动遇了,哎,我个人不建议这个,因为他会一直占用这个 cpu, 那他这里有一个让你选的,那就很爽。 这个这个默认是仅在事件按下时显示这个默认,这个勾是不打上的,那么我们就把它打上,然后就可以想预览哪一个就自己选择,就不会说鼠标到哪个地方就哪个地方都预览。 好了,今天的分享就到这里,感谢大家的观看,希望能够对大家有所帮助。