![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序
【拾光静好 微微一笑】
用力只能做到及格,用心才能做到优秀
展开
-
记录小程序使用七牛云上传图片详细步骤及遇到的坑 小程序七牛云上传文件代码封装
upload(){ var that = this; var state = 0; // 上传第几张图片 var imgList = []; // 保存图片数组 this.getUploadToken().then(res =>{ console.debug("res====",res) if (that.data.fileList.length < 9) { wx.chooseImage({ cou原创 2021-09-16 16:20:24 · 2746 阅读 · 1 评论 -
vant weapp日历组件性能优化 Calendar 日历添加min-date最小日期页面加载缓慢
通过min-date和max-date定义日历的范围,需要注意的是min-date和max-date的区间不宜过大,否则会造成严重的性能问题。官方文档明确强调,通过min-date和max-date定义日历的范围,需要注意的是min-date和max-date的区间不宜过大,否则会造成严重的性能问题。故我们需要根据具体业务需求适当修改页面展现方式Calendar 日历组件使用条件1、如若选择未来几个月内的日期、区间推荐使用;2、区间不会太大;日期picker除上述条件,需要使用日期的,最好使用原创 2021-06-26 15:01:12 · 4434 阅读 · 2 评论 -
微信小程序文件下载预览 真机调试可以 但直接预览打不开 小程序文件下载 小程序文件预览
只要确保真机调试和调试状态下可以下载并预览文件即可,上线后即可预览成功原创 2021-06-23 17:08:40 · 1403 阅读 · 0 评论 -
小程序空格 中文空格编码 微信小程序中文空格字符 英文空格字符怎么打
中文空格 英文原创 2021-05-30 17:47:35 · 891 阅读 · 0 评论 -
微信小程序分享onShareAppMessage回调函数 分享成功或失败事件不生效
微信官方已经关闭小程序分享onShareAppMessage方法中关于分享事件调用成功或失败的回调,详见官方文档关于微信小程序页面分享方法参数说明原创 2021-05-18 13:42:29 · 10426 阅读 · 0 评论 -
微信最新授权登录 微信小程序无法弹出授权弹框 open-type getUserInfo获取不到用户信息 授权不弹框
解决办法使用getUserProfile接口 !!!! 大大的坑啊,调试了半天getUserProfile(e) { // 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认 // 开发者妥善保管用户快速填写的头像昵称,避免重复弹窗 wx.getUserProfile({ desc: '用于完善会员资料', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写 success: (res)原创 2021-05-01 01:24:01 · 3564 阅读 · 2 评论 -
微信小程序清除缓存clearStorageSync和removeStorageSync的区别 清除缓存问题 数据缓存详解
wx.setStorage(key)和wx.setStorageSync(key)将数据存储在本地缓存中指定的 key 中。会覆盖掉原来该 key 对应的内容。除非用户主动删除或因存储空间原因被系统清理,否则数据都一直可用。单个 key 允许存储的最大数据长度为 1MB,所有数据存储上限为 10MB。wx.setStorage和wx.setStorageSync 唯一的区别就是同步和异步;wx.setStorageSync是同步存储,较为常用,意思是上一步执行完毕后再进行存储。以Sync结尾都是同步,以原创 2020-08-12 11:06:58 · 34972 阅读 · 2 评论 -
记录vant weapp 小程序组件库遇到的坑以及ios和安卓兼容问题 SubmitBar
组件一:SubmitBar 提交订单栏IOS不显示,安卓正常前情提要(可忽略)因为项目比较着急,正好这个组件跟设计图类似,欣喜万分,拿来即用。然鹅,现实跟想象中真是完全不同。IOS上完全不展示这个组件,安卓正常。苦恼万分,想着只是css问题(想着vant不可能有这种不显示的bug),浪费半天时间,无果。第二天头脑清醒的把组件拿到别的页面尝试,竟然能展示。问题及解决最终,判定是因为SubmitBar 放在了tab标签里面。如果放在tab里面IOS就会有问题,放在外层就正常。组件二: flex布原创 2020-07-30 16:00:18 · 7122 阅读 · 1 评论 -
小程序内部一键关注关联公众号 如何实现小程序无跳转关注公众号
上效果实现前提打开微信公众平台----->设置 ---------> 打开公众号关注组件注:设置的公众号需与小程序主体一致。具体实现//wxml<official-account bindload='loadSuccess'></official-account>//js /** 关注公众号组件 */ loadSuccess(e){ console.log("关注公众号组件加载成功") },official-account 为公原创 2020-05-28 17:58:03 · 5065 阅读 · 10 评论 -
小程序实现圆点边框 解决 dotted不兼容 小程序圆点边框兼容问题 如何在小程序实现兼容的圆点边框
先上效果图由于业务需要,需要做一排圆点,实现方法有很多,在此记录一下另一种实现方式。最终效果:效果前提由于仅仅做小程序,而且使用了weUI样式,其中有一个徽章badge,突然奇想用徽章badge做一排圆点,在badge wxss中修改你需要的背景色,字体颜色同背景色即可。 <mp-badge content="8" style="margin-left: 10px;"/> <mp-badge content="8" style="margin-left: 10px;原创 2020-05-28 16:56:15 · 1010 阅读 · 1 评论 -
微信小程序清除输入框内容组件 清空Input weui中一键清除input内容
前提首先,我是在引用weUI扩展组件情况下,自己做了适当修改,即可全局引用Input, 使用清空输入内容功能。components为weui组件,本身weui是没有input组件的,我自己添加了一个Input-clear组件。使用方法第一步:引入weUI组件,方法很多,我是直接引入了weUI的components文件夹,也可用其他方法引入,详见微信公众平台文档说明第二步: 在app.wxss页面引入weui.wxss第三步: 在需要使用weUI组件的页面的json文件中添加你需要的组件,一定要原创 2020-05-26 18:40:38 · 5881 阅读 · 2 评论 -
微信小程序顶部滚动通知 仿支付宝顶部通知 小程序滚动文字
先呈上效果图主要代码//wxml部分<view class="scroll-top" hidden="{{isHiddenMsg}}"> <scroll-view> <view class="msg-icon notice-icon"> <image src="../../../static/images/show-info...原创 2020-05-06 11:46:55 · 1991 阅读 · 2 评论 -
小程序如何引入weui样式 小程序如何使用weUI样式插件 weUI如何使用
weUI在微信小程序中的引用小程序如果想引入weUI,需要以下几步,本文章主要介绍通过页面按需加载引入模式:第一:下载weUI,三种方式一、可以通过npm方式下载构建,npm包名为 weui-miniprogramnpm install weui-miniprogram二、去github下载https://github.com/Tencent/weui-wxss三、可以通过页面按需...原创 2020-02-28 13:12:24 · 2687 阅读 · 0 评论 -
小程序多状态class 动态控制多个class 动态添加删除class
我们在小程序页面制作时通常会遇到不同状态展示不同的样式或者内容,当然如果只有2种情况最好办,直接三元运算符和 逻辑或都可以解决,但是如果是三种状态四种状态呢?遇到这种情况我是这么处理的(根据条件判断采用wx:if else),下面的小栗子是展示的4种状态。如果你有更好的方法,欢迎交流!<view class="invoice-item-flex" id='invoice-item-stat...原创 2020-02-28 11:34:01 · 2138 阅读 · 2 评论 -
小程序模糊搜索功能
小程序模糊搜索功能小程序模糊搜索功能,记录一下转载 2020-02-27 15:50:16 · 365 阅读 · 0 评论 -
微信小程序利用oss 上传图片到阿里云 上传进度及失败处理 判断上传图片格式
业务需求场景分析: 我们的项目需求是用户上传自己的拍摄的图片到阿里云服务器,目前是每次上传一张实现过程分析 首先微信公众平台官方给出了上传图片的API wx.chooseImage 然后根据调用成功后的success事件中通过拿到的文件名称,先做一个判断, 格式是否正确,格式不正确弹框提示并返回(为了更加准确的判断,先对所有格式的后缀名变更为大写,然后再统一做比较)。 上传文件...原创 2019-03-17 14:58:05 · 2541 阅读 · 5 评论 -
微信小程序上传视频到阿里云服务器,oss上传视频到阿里云
业务需求场景分析 需要客户上传自己拍摄的视频,时长限制为90s以内实现过程分析 首先微信公众平台官方给出了上传视频的API wx.chooseVideo 然后此时上传视频跟上传图片就略微不同了,此时上传图片是需要在success 事件中判断上传格式是否正确对吧, 但是上传视频手机端是没法选择图片的,哈哈……,电脑端的话如果选择图片,则直接跳转至fail函数,所以,此时判断格式是否...原创 2019-03-17 15:12:53 · 3910 阅读 · 1 评论 -
瀑布流布局 流式布局 不规则图文排列布局 微信小程序按顺序排列的瀑布流布局
微信小程序按顺序排列的瀑布流布局首先我说一下,我的项目需求:瀑布流布局排列按照一定的顺序排列图文结合不好意思,跟大家分享下我的过程,不想看的直接跳过看最后,起初的实现思路是:1、由于图片是从后台获取的,大家都知道image 有一个bindload事件,就是图片加载完成,就是在图片加载完成后获取到该图片的高度,然后通过既定的宽度,算出图片的实际显示高度。2、知道了图片的实际显示高...原创 2019-03-17 00:46:14 · 4592 阅读 · 11 评论 -
如何解决小程序视频插件bug找不到playerid为newsDetailVideo的txv-video组件
各位宝宝,我先简单说下我遇到的问题:点击网页先出现找不到playerid为newsDetailVideo的txv-video组件错误,然后页面渲染竟然无误,这是什么原因呢?首先:我的vid是后端动态获取的,其次:在小程序进行onload事件时,第一次渲染wxml时,vid的值是没有的,所以会提示此错误最后:解决办法就是在拿到vid之后再显示此组件,具体代码如下:<view hidd...原创 2018-12-03 16:13:33 · 2489 阅读 · 2 评论 -
小程序如何添加视频插件,插入视频组件,小程序添加腾讯视频
小程序如何添加视频插件,插入视频各位小伙伴,需要在小程序中插入腾讯视频,详细步骤如下:第一步:打开微信公众平台依次选择:设置——第三方服务——添加插件——腾讯视频注意:添加后保存该插件的appID第二步:在小程序app.json文件中引入 &amp;amp;quot;plugins&amp;amp;quot;: { &amp;amp;quot;tencentvideo&amp;amp;quot;:原创 2018-12-03 14:26:07 · 5537 阅读 · 4 评论 -
小程序二级页面分享 小程序分享先跳转至首页再跳转至详情页 小程序分享空白页问题
业务需求场景分析 小程序分享二级页面时, 1、先进入首页再跳转至二级页面; 2、对于还没有经过微信授权的新用户,先经过授权,再跳转至首页、然后跳转至目标页面实现过程分析 **不想看我啰嗦可以跳过,直接看代码!^_^** 由于直接分享二级页面没有返回按钮,借鉴其他网站,先跳转一级页面,再跳转至目标页面,在此项目中,我们是跳转至首页,点击返回,用户可以看到所有TAB页面。 首先,在...原创 2019-08-08 13:04:19 · 1197 阅读 · 0 评论 -
微信小程序ios倒计时时间不显示,安卓能正常显示,小程序倒计时兼容问题
一般在做投票时或者拼单时都需要展示倒计时,但是小程序中ios中倒计时不显示,安卓中能正常显示原因是:IOS不支持2019-4-1 10:20:30这种格式,只需要将 - 替换为 / 即可解决:var remainDate = "2019-4-1 10:20:30";var newRemainDate = remainDate .replace(/-/g, "/") //转换后即可兼容...原创 2019-04-03 15:58:21 · 2499 阅读 · 0 评论