微信小程序开发-第八节-封装请求功能函数&&列表渲染

已于 2023-11-24 14:24:11 修改
阅读量92 收藏
点赞数 1
文章标签： 微信小程序 小程序
于 2023-11-17 16:54:07 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_74006889/article/details/134466332
版权

本次我们将上节所写的函数进行功能封装，并进行展示；

首先我们在utils下建立request page，然后编写函数（此处细节同上节文章），注意结果要返回一个promise，原因下文介绍。

通过import引入request，由于函数的同步性，我们需要用到async await来进行函数异步，而await需要一个promise的返回值。url的获取可参见第1节文章所搭建的代码，如下图部分

本文所使用的url为方便读者阅读，并未进行全局变量app.d.url的设置，同样也省略了geturl的函数，在实际应用中，一般规模较大，应进行完整编写

本次展示内容为banner部分，即把第六节中我们所使用的静态资源轮播图换成我们所请求的banner。 

其中for循环部分语法参见WXML 语法参考 / 列表渲染 (qq.com)

ZH Liu
关注
微信小程序——封装公共函数的方法
wct040923的博客
03-28 2044
总体来说此方法并不难，各位可以直接尝试一下封装属于自己的公共函数，做出属于自己的工具类，期待和各位一起进步呀！
封装小程序request请求[接口函数]
灵魂学者的博客
02-28 2767
本篇是讲进行对微信小程序网络数据请求的接口请求封装。在这篇文章中讲到小程序官方提供的异步API都是基于回调函数来实现的，在大量的使用这种回调函数就会造成回调地狱的问题，以及代码的可读性和可维护性差，通过对小程序API的Promise化能解决。
uniapp小程序封装常用工具函数_uniapp封装函数
最新发布
2401_84182824的博客
04-12 707
else if (bankno.length == 20) { // 20位2个校验位。if (bankno.length == 19) { // 19位1个校验位。//base64格式图片。// valid = false 第二位数不在3-9范围内。// valid = false 中间只有一个点,格式错误。//如果图片字符串不含要清空的前缀,可以不执行下行代码.// valid = false 最后一位校验码错误。title: ‘银行卡号格式错误’,// Luhn校验代码…
uniapp小程序封装常用工具函数
2303_76218115的博客
04-19 1934
类似的工具函数还有很多，这里暂时不一一列举了，上面提到的银行卡校验，还可以使用阿里公开的一个校验接口cardNo=银行卡号码&cardBinCheck=true这个接口会返回对应的银行简称银行卡类型,如果想要显示对应的银行logo的话，可以联系我，由于JSON数据太大，没办法全部放在这里。
【全局优化】微信小程序全局封装防抖节流函数，让你的程序更加高效流畅
Shids_的博客
03-22 5132
【全局优化】微信小程序全局封装防抖节流函数，让你的程序更加高效流畅
微信小程序使用uni-app开发小程序及部分功能实现详解心得
Fang2001131919的博客
06-19 4608
uni-app 是一个使用 Vue.js (opens new window) 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台；到此这篇关于微信小程序使用uni-app开发小程序及部分功能实现的文章就介绍到这了,更多相关微信小程序用uni-app开发小程序内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
微信小程序01---小程序初始
蜗牛的博客
10-23 1441
微信小程序初始
微信小程序-cnode社区版-程序源码.zip
05-31
8. **组件化开发**：微信小程序支持自定义组件，可以将常用功能封装成组件，提高代码复用性和可维护性。项目中可能会包含多个自定义组件，如轮播图、导航栏、列表等。 9. **样式设计**：WXSS提供了CSS大部分功能，...
微信小程序----开发
2301_76855186的博客
06-12 402
在项目中大部分的页面要用户必须是登录状态才能被访问，小程序中并没有提供类似于路由守卫的功能，它的通用做法是将检测登录的逻辑封装到一个组件（authorization）当中，只要在页面中应用这个组件就能实现用户登录状态检测的功能了。小程序中的npm构建是将使用npm管理的第三方包打包成一个小程序可以使用的格式，并在小程序开发工具中进行调试和预览.在登录页面就进行判断，传递过来中是否有地址，有就使用传输过来的，没有就指定默认的首页。在登录成功后获取地址的参数（一个页面的路径），重定向到原来的页面。
微信小程序和uni-app面试高频知识点
qq_53694927的博客
11-27 876
微信小程序和uni-app面试高频知识点
微信小程序工具函数封装
12-13
本文实例为大家分享了微信小程序工具函数封装的具体代码，供大家参考，具体内容如下 const formatTime = date => { const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() const hour = date.getHours() const minute = date.getMinutes() const second = date.getSeconds() return [year, month, day].map(forma
微信小程序请求函数的封装
weixin_64187996的博客
07-24 778
学习笔记
微信小程序常用函数的封装
a_靖的博客
01-04 7169
微信小程序开发交流qq群 173683895 承接微信小程序开发。扫码加微信。 在小程序里面经常会反复用到一些方法，例如： 1.网络请求， 2.时间戳转换成日期时间， 3.根据数组中的对象的属性数值大小进行排序， 4.判断手机号码是否正确， 5.页面跳转url参数解析， 6.截取并保留一个数值的后两位小数点， 7.验证身份证填写是否正确 等等，为了节约时间，咱们可以把...
微信小程序 10 封装功能函数库
小哞^同^学的技术博客
07-11 564
首先我们要知道， 是一个 异步请求，即 ajax。如果你想把它 进行一个封装，那么 就要 解决 异步请求拿不到 指定数据和值的问题。：向外暴漏 方法 或 属性。：向外暴漏方法和属性，导入的时候 可以 指定任意名字。 导入这个 写好的 功能函数模块库。 肯定是 拿不到 这个 数据的，因为 wx.request() 是一个 异步请求。也就是 不跟你同步，那人家可能还没执行完呢，没拿到这个数据呢，你就 result = request() 了。。肯定拿不到呀。当你new 了一个 Promise 对象，那么 初始
小程序工具函数封装
qq_43559271的博客
12-20 187
工具函数封装，集合一些常用正则验证函数，字符串处理，数组处理，对象处理，时间操作等模块
小程序函数封装
夕尧的博客
05-14 199
<5>与小程序相关的函数封装集合:自己写的，如有改善意见，定虚心采纳！ /**- wechat request encapsulation-**/ // request const fetch = ( params ) => { let data = params.data || '', method = params.method || "get", url = params.url, loading = params.loading; return ne
微信小程序--云开发之云函数封装使用
海到无边天作岸 山登绝顶我为峰
12-01 3366
前言 微信小程序的云开发对数据记录有一定的限制。 比如，自己创建的一条记录，只可以本人更新，别人却无法进行操作（关键是操作了还不报错？？？） 当然还是有解决方法的： 把需要进行的数据操作放在云函数中，用户通过调用云函数就可以对任何一条数据操作了（前提是数据允许操作）。 但是微信小程序对云函数有个数限制，好像最多有20个云函数。 开始的时候没有注意到这一点，吃了一点亏，后面海轰发现，将一个项目所需要...
【微信小程序】微信小程序函数封装
疾术客
05-14 2299
函数封装，一节省编写代码的时间，二不容易出现错误，三节省代码，简洁，便于后期维护。 希望对于新手的你能够有帮助！一起加油啊！ 1.wx.navigateTo() 保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。 可封装函数为： //跳转新页面页面，保留当前页面。 function navigateTo(url) { wx.navigateTo({ ...
小程序笔记 -- 封装函数
lljxk2008的博客
09-08 3261
封装就是把实现某 功能 的代码拿出来做为单独的函数, 在不同的地方可以直接使用 封装函数最大好处就是可以避免代码的重复书写, 从而提高效率 如果某功能要经常使用, 则应该考虑将这个功能封装为函数, 否则用一次这个功能就得写一次该功能的代码 小程序中的封装, 也就是js封装 1.单独创建一个js文件, 不用创建其它的wxml, wxss, json文件 2.书写js内容, 这仅仅是一个...
微信小程序scroll-view实现导航栏点餐功能详解
"微信小程序利用scroll-view组件实现了一个左侧导航栏与右侧内容同步滚动的点餐功能。用户点击导航栏中的种类，页面会自动滚动到对应的商品锚点，同时选中的种类在导航栏中高亮显示。" 在微信小程序开发中，`scroll...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值