【微信小程序】页面tabBar切换、下拉刷新

目录

前言

一、切换

1.为什么使用

2.注意事项(官网提示)

3.如何使用(附源码)

二、下拉刷新

基本上,所有的小程序,页面底部都有个,来实现页面的切换,效果如下

在 . 中提供 配置,不仅仅是为了方便快速导航,更重要的是在和小程序端提升性能。在这两个平台,底层原生引擎在启动时无需等待引擎初始化,即可直接读取 . 中配置的 信息,渲染原生。

当设置 为 时,将不会显示 中的 是一个数组,只能配置最少2个、最多5个 , 按数组的顺序排序。 切换第一次加载时可能渲染不及时,可以在每个页面的生命周期里先弹出一个等待雪花( -使用了此方式) 的页面展现过一次后就保留在内存中,再次切换 页面,只会触发每个页面的,不会再触发。顶部的 目前仅微信小程序上支持。需要用到顶部选项卡的话,建议不使用 的顶部设置,而是自己做顶部选项卡,可参考 -->模板->顶部选项卡。

是全局文件,需要在 .配置

根据自己的要求来配对,我这里是有四个页面,分别是【首页、分类、购物车、我的】

这里的四个页面都是在中创建的,是主要的四个功能页面,需要在.注册(如果使用的 在创建文件夹是,会提示是否在.中注册,勾取一下就可以),展示一段注册代码,如下:

是写页面地址,这里的页面地址推荐在中创建

是写图片地址,图片放到中寻找路径即可,我们每次点击切换后,为了更好的展示效果,图片都会有点击前点击后的状态,这里的图片是点击前

这里就是放点击后的图片,与点击前有明显的区别,就是为了表现出我们点击到了,并且切换了

自己起名字

其中还有许多属性,可以通过自己对项目的要求进行修改和优化,修改官网的默认样式

我的配置源码如下,如果需要完整代码,私信留下邮箱

下拉刷新非常的简单,只需要一行代码就行,需要学会看官网的介绍,这单词我是记不住

在 .中的加上"":即可,默认是关闭

如果想要改名字,需要先将"": "-"注释掉,再到中的改掉名字

还有很多样式可以根据官网的注释进行修改,得到自己想要的样子

© 版权声明
THE END
分享