微信小程序
小程序的一些案例功能,demo,组件应用等等...
阿里巴啦
vue3/vue2/ai/nuxt/uni-app/node/electron/react/微信相关/小程序-前端开发工程师,不定时更新博客,分享前端相关的知识.
展开
-
uni-app 微信小程序vendor.js 过大的处理方式和分包优化
小程序工具提示vendor.js过大,已经跳过es6向es5转换。这个转换问题本身不用理会,因为vendor.js已经是es5的了。HBuilderX创建的项目勾选运行–>运行到小程序模拟器–>运行时是否压缩代码cli创建的项目可以在package.json中添加参数–minimize,示例:“dev:mp-weixin”: “cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue...原创 2021-11-15 11:20:45 · 15764 阅读 · 3 评论 -
微信小程序-天气预报案例之和风天气API-简易版
小程序-天气预报简单应用版本。鉴于有些小伙伴对云开发不熟悉,就弄了个简单版的。气象数据:和风天气,苹果app也是用和风天气sdk的哦。,自行去申请key密钥哦。和风天气:小程序合法域名配置:https://devapi.qweather.comhttps://geoapi.qweather.com和风天气密钥key放app.js里面案例截图:...原创 2021-04-22 10:27:13 · 3695 阅读 · 1 评论 -
微信小程序-天气预报案例之和风天气API-云开发版
天气预报,在现实生活中是非常常用的,我们平时都可以通过自己的手机上面或网上进行查看天气等等;这个demo可以应用到许多小程序应用上。本案例先弄个简约版本的(权限还没审核下来)…使用到的接口是:和风天气,具体使用自行查阅文档哦。大概先长这样,后续再进行优化升级;具体案例可以查阅源码,持续更新ing:小程序天气demo...原创 2020-01-15 09:52:35 · 8963 阅读 · 29 评论 -
微信小程序-向左滑动删除,取消收藏效果案例
微信小程序左滑删除效果的实现,平时用到的app都在使用这个效果,对组件向左滑动,右侧会出现一个删除按钮,点击确认删除此组件模块;效果图如下:如发现什么问题提可以留言交流哦,谢谢~具体案列可访问:https://github.com/xiexikang/xcx-left-sliding-delete...原创 2019-11-01 15:20:30 · 1584 阅读 · 1 评论 -
微信小程序上传多张图片-视频,预览图片
考虑到日常项目会用到,就整理了一下这案例,可以上传指定数量的图片或视频;wxml:<view class='the-tit'>上传图片:</view><view class='share-pics'> <view class='slug-cons'> <view class='pics'> <view ...原创 2019-06-11 15:06:05 · 5888 阅读 · 1 评论 -
微信小程序-基于腾讯地图api的省市区三级联动案例
腾讯的WebService API,在项目的要用到定位,地图等等功能时会应用到,小程序官方提供的文档是没有过多的功能来满足项目需求,所以我们可以查看一下腾讯地图的api来对应开发相关的功能,功能还是蛮多的,具体自行查看文档和配置秘钥。下面的案例博主写了个 省市区地址选择的案例供大家学习参考:先上图吧:具体案例可访问本人github:https://github.com/xiexikang...原创 2019-05-08 16:12:25 · 2878 阅读 · 0 评论 -
微信小程序用canvas生成分享图片,微信朋友圈海报
小程序的canvas画布绘图与h5的canvas有类似的功能,小程序的应用场景大多数是用于制作分享图,模块上是有文字、图片等等变量时,因为只有图片才能保存到相册,所以得先把模块合成为一张图片,此时canvas就能显示它的强大功能了。具体可查阅官方小程序[canvas组件的api]应用;本案例还增加了切换卡片的功能,可忽略,不过这里配合了canvas的操作,也可以参考一下;先看效果图:(个人...原创 2019-03-13 17:31:42 · 3022 阅读 · 1 评论 -
小程序云开发中遇到的一些坑
目前正在做一款自己的小程序,有空可以搜索“小K旅行 ”,页面很好看哦…前几个月吧,小程序开放了新的能力——「小程序·云开发」,帮助开发者快速构建微信小程序的后端服务。作为一名微信小程序的开发者,也在不久前尝试了小程序云开发,并将我自己在开发过程中的经验记录一下。简单的来说,小程序云开发是一款 Serverless 服务,他为开发者提供了「云函数」、「云数据库」和「云文件存储」,并且将这些能力封...原创 2019-02-27 12:08:16 · 3555 阅读 · 0 评论 -
微信小程序实现单选多选功能,自定义样式,[可限制选中的数量]
小程序的组件checkbox,checkbox-group实现单选和多选功能是比较容易的,就是实际项目中考虑到页面美观和用户体验,还是选择自定义的,那么我们可以使用view组件,然后用js来处理实现跟表单的单选、多选一样的效果。单选操作:多选操作:完整案例可以访问本人github :https://github.com/xiexikang/xcx-checked...原创 2019-03-06 10:21:45 · 6674 阅读 · 1 评论 -
微信小程序组件之rich-text,转义显示富文本操作
小程序的rich-text组件使用:接口获取的数控数据转义后wxml结构&amp;amp;amp;amp;amp;lt;view class='content'&amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;amp;lt;view class='in'&amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;amp;lt;vie原创 2018-12-11 16:29:42 · 6457 阅读 · 0 评论 -
微信小程序map组件路线规划,腾讯地图sdk的应用案例
案例:可访问本人github地址(功能完善中…)使用腾讯地图SDK ; 目前已有功能:搜索,地址列表,pio点,出行方式,路线…微信小程序map组件-腾讯地图SDK...原创 2018-12-27 18:03:25 · 2984 阅读 · 3 评论 -
微信小程序map组件地图定位当前位置
wxml:&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;map id=&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;map&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot; latitude=&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;{{latitude}原创 2018-12-21 14:12:38 · 13304 阅读 · 3 评论 -
微信小程序:连续签到7天签到积分获得功能设计
每周每天签到获得积分的案例功能设计:计算每天签到得1分,显示得到的签到积分,连续签到3天[周一二三]即得+多3分,连续签到7天[周一二三四五六日]+多7分,没有连续即不显示多余的3分或7分的提示…wxml结构:<!--pages/signIn2/signIn2.wxml--><view class='sign-new'> <view class='in'...原创 2018-12-01 13:45:08 · 13859 阅读 · 4 评论 -
微信小程序:以7天为周期,连续签到7天功能效果
此功能为1,2,3,4,5,6,7这个为一周期,连续签到的功能; 通过计算是否为整除7天计算,切换数目,改变周期表、如果图如下: wxml结构&amp;amp;amp;amp;amp;amp;amp;lt;!--pages/signIn/signIn.wxml--&amp;amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;amp;lt;view class='sig原创 2018-08-23 17:37:12 · 19840 阅读 · 10 评论 -
微信小程序,实现图片/选项滑动切换效果scroll-view
此功能的实现,跟滑动切换栏原理一样,简单实用,先看看效果吧!实用scroll-view组件的属性scroll-scroll-left来判断控制、wxml结构<view class='invite-friend'> <view class='invite-head'> <view class='inv-card'> <...原创 2018-08-11 15:25:11 · 6525 阅读 · 6 评论 -
微信小程序,类似微信点击语音播放效果,不会互相干扰播放状态
类似平常微信语音聊天的效果…. 根据开发的需求,先理清一下思路,点击语音播放与暂停/停止,切换下一个语音等; 小程序对于audio的组件的一些api方法已经不支持了,详情可以参看:微信小程序audio组件文档 嗯嗯,这下子,该怎么办呢? 就如上面提到,小程序1.60版本后,给开发者提供了这个wx.createInnerAudioContext()api…具体使用可以看文档;好的...原创 2018-08-02 14:04:47 · 12685 阅读 · 15 评论 -
微信小程序,标签云效果:自定义颜色,并随机显示不同颜色
微信小程序自定义颜色,标签云效果- wxml代码结构&amp;amp;amp;amp;amp;amp;amp;lt;view class='content'&amp;amp;amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;amp;amp;amp;lt;block wx:for=&amp;amp;amp;amp;amp;amp;quot;{{labArr}}&原创 2018-08-02 11:28:41 · 9410 阅读 · 1 评论