![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
微信小程序
weixin_流年
这个作者很懒,什么都没留下…
展开
-
微信小程序rpx及样式的用法
微信小程序中css的尺寸单位是rpx单位,rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素。微信小程序尺寸单位rpx标准微信小程序也支持rem尺寸单位,rem和rpx的换算关系:rem: 规定屏幕宽度为20rem;1rem = (750/20)rpx注:开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。建议:设计稿使用设备宽度750px比较容易计算原创 2021-03-31 10:11:10 · 1497 阅读 · 0 评论 -
微信小程序页面跳转传参,参数过长报错解决办法
在微信小程序的开发中,页面之间的跳转传参是非常常见的。一般参数较少的时候,这样的传参方式很简单。但是有的时候,我们需要传递的参数可能是一个对象,但是这个对象属性很多, 通常的做法是需要先转成字符串(使用用JSON.stringify()转换成字符串)B页面在用JSON.parse()再转换回对象。但是这样的传参方式遇到一个问题,对象数据长度过大时B页面在用JSON.parse()会报错。Unexpected end of JSON input解决办法也很简单如下:A页面传参时:encodeURI原创 2021-03-31 10:06:07 · 3115 阅读 · 0 评论 -
微信小程序父子组件之间传值
一: 父组件传值给子组件1.在父组件中引用子组件(json文件中)2.在子组件的json文件中把自己定义为子组件3.在父组件中,子组件的引用处,绑定一个属性( text ),并传递想要给子组件的值( parentParam )4.在子组件中的js中使用 properties 获取值,这样就可以在子组件中用 this.data.text 获取到这个值二 子组件传值给父组件1. 子组件在需要传值时,使用triggerEvent传给父组件一个事件( myevent ),并传原创 2021-03-29 14:40:51 · 430 阅读 · 0 评论 -
微信小程序页面动态修改导航栏标题文字内容
在实际的项目开发中,一般我们页面导航栏的标题文字都不是固定的,而是根据场景需要动态设置的,这个如何实现呢。微信官方提供的方法如下:1.设置动态的onLoad: function (options) {wx.setNavigationBarTitle({ title: options.name })//options.name表示上个页面传过来的文字},2.直接设置onLoad: function (options) {wx.setNavigationBarTitle({...原创 2021-03-29 14:28:00 · 2140 阅读 · 0 评论 -
微信小程序如何获取openId
微信小程序的开发过程中,有时前端需要获取到openId来使用。那究竟如何获取呢,方式很简单,获取用户OpenID,用wx.login就可以。如下:wx.login({ success: function (res) { console.log(res) if (res.code) { console.log('通过login接口的code换取openid'); wx.request({ .原创 2021-03-29 14:21:33 · 2875 阅读 · 8 评论 -
微信小程序上传图片时校验所选图片是否为身份证图片
在小程序的开发中,有时需求会有上传身份证照片,一般如果没有特殊要求的话,这块可以直接调微信小程序提供的API来实现,但是如果在上传图片的同时还要求校验图片是否为身份证照片时,这就需要做一些处理了。小程序的官方也提供了解决办法,可以使用扩展能力中的0CR插件。官方文档小程序插件文档OCR 支持使用步骤如下:首先打开小程序的后台,点开设置,选择第三方设置。然后找到插件选项,打开并添加ocr支持插件。添加完成后 ,需要领取免费额度,是一天100次。多了就需要购买。链接挂下方https:原创 2021-03-08 10:53:09 · 2173 阅读 · 2 评论 -
微信小程序上传图片(从相册选择或者拍照)
在平时的项目开发中,小程序图片上传应该是经常用到的,话不多说,直接开始。上传图片主要用到的是小程序官方提供的两个API:一个是wx.chooseImage,一个是wx.uploadFile 有不懂的小伙伴可以直接去看官方文档,上面解释的很清楚。下面贴出我项目代码片段,仅供参考。 wx.chooseImage({ count: 1, // 默认9 sizeType: ['original', 'compressed'], sourceType: ['album原创 2021-03-08 10:42:19 · 5369 阅读 · 0 评论 -
微信扫一扫扫描二维码跳转到小程序指定页面
1微信公众平台-开发-开发设置-扫普通链接二维码打开小程序2点击添加3设置二维码规则,选择测试范围4 保存后,可根据测试连接生成二维码,通过微信扫一扫功能进行测试跳转5在跳转页面的onLoad中获取二维码中的参数如下:onLoad: function (options) { const {q} = options; if (q) { let urlStr = decodeURIComponent(q); } }...原创 2020-12-10 17:40:38 · 7626 阅读 · 2 评论 -
微信小程序中参数加密解密
常用的方法如下加密:encodeURIComponent(参数)解密:decodeURIComponent(参数)原创 2020-12-10 17:32:00 · 1620 阅读 · 0 评论 -
微信小程序线上根据Source Map文件快速定位错误代码
不废话,直接上流程1 先登录自己的微信小程序后台将Source Map文件下载到本地;2 解压下载的文件,可得到以下目录该目录对应的就是我们小程序分包也就是说,如果我们的页面在packageDynamic包下,我们定位的时候就要使用packageDynamic下的文件如果我们的小程序没有分包的话下载下来直接解压可看到下面如下目录点击解压后的文件夹出现的就是下面的这个图片。3添加一个定位页面,代码入下,copy过去直接运行即可 <!DOCTYP.原创 2020-12-10 17:29:42 · 2140 阅读 · 4 评论 -
微信小程序web-view组件使用及内嵌H5页面注意事项
基本语法:<web-view src="https://你的域名"></web-view>其中,url必须在管理后台加进业务域名,并且是https开头的。使用了web-view,页面将不能放置其他元素,因为web-view会铺满整个页面电脑端调试,需要在开发者工具的项目设置里把基础库版本改为最新的(1.6.4)常见的注意事项:1. 首先,web-view组件的src属性 指向的网页链接必须是https开头的。2. 其次,h5页面内的js和a...原创 2020-11-11 15:40:24 · 3068 阅读 · 4 评论 -
微信小程序上线缓存及解决办法
小程序在更新迭代版本之后,我们要是之前已经在手机打开过的话,再重新打开经常会有一个问题,就是我们新迭代的功能不能立即使用,在你手机上显示的版本还是之前的版本,此时我们或许会有疑问,我的新版本明明已经上线了,为什么手机上还没显示,其实这就涉及到一个小程序的缓存问题。一般情况下,我们只需要把小程序删除,再重新打开就可以了,但是这种体验明显不是太好,尤其是对于用户来说,有没有什么比较好的解决办法呢,当然是有的,解决办法如下:把下面这段代码放在app.js里面的onshow里upDataApp:原创 2020-07-31 09:24:11 · 6628 阅读 · 1 评论 -
wx:key(微信小程序)报警告does not look like a valid key name?解决办法
微信小程序开发中,不经意间遇到过如下的警告:报这个警告的原因是因为微信文档做了更新,但是没在文档中说明,所以很多人会有这个疑惑,解决办法也很简单:文档更新前wx:key="{{index}}"文档更新后:wx:key="index"循环的时候,绑定key的时候把那个大括号去掉就可以了;...原创 2020-07-30 10:12:46 · 4327 阅读 · 0 评论 -
微信小程序过滤器 filter的使用(过滤器 filter)
我们在实际的项目开发中避免不了传输数据与展示数据不同,直接修改原数据显然是不合适。这个时候如果有过滤器的话,可以很方便的解决我们的问题,但是遗憾的是小程序目前没有过滤器,只能通过自己来模拟。下面就提供两种在小程序中使用过滤器的方法:方法1通过在js中自定义函数来实现过滤功能data : { originTime : 1811748300578} getTime (){ return FormatUtil.getDate(this.data.originTime );}..原创 2020-07-30 10:03:32 · 14085 阅读 · 1 评论 -
微信小程序图片预览(wx.previewImage(Object object)
在微信小程序的开发过程中,有时候我们会遇到这样的需求,点击图片可预览图片,并且可以左右滑动等相关操作,此时我们可以使用微信给我们提供的相关API来实现,具体实现方式如下:wx.previewImage(Object object)在新页面中全屏预览图片。预览的过程中用户可以进行保存图片、发送给朋友等操作。https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.previewImage.html 微信api地址效.原创 2020-07-30 09:36:15 · 4490 阅读 · 0 评论 -
微信小程序跳转到H5(打开H5页面)
在我们实际开发的过程中,有些场景需要从微信小程序跳转到H5页面,使用web-view组件就可以了;实现的方式也很简单,具体实现方式如下:1 小程序如果要正式发布的话,需要配置业务域名并上传验证文件。 a 域名需要备案好的一级域名。 b 配置HTTPS 证书。 c 进入到小程序后台https://developers.weixin.qq.com设置-开发设置 -业务域名 d载校验文件,并将文件放置在域名根目录下。配置好了以上几步就可以进行正常的跳转了...原创 2020-07-28 10:33:18 · 23344 阅读 · 2 评论 -
微信小程序一键获取发票抬头
在日常微信小程序的开发过程中,有时候我们的需求需要获取微信发票的相关信息,本文就来介绍下,在微信小程序中,如何获取我们保存的发票消息,以及用户同意授权或者拒绝授权之后,再次拉起授权等。选择用户的发票抬头 用到的微信小程序api是 wx.chooseInvoiceTitle(Object object) 链接如下:https://developers.weixin.qq.com/miniprogram/dev/api/open-api/invoice/wx.chooseInvoiceTitle.ht.原创 2020-07-28 10:01:15 · 4955 阅读 · 4 评论 -
微信小程序如何分享到朋友圈
微信小程序之前的分享是不支持直接分享到朋友圈的,之前分享的处理方式一般都是通过canvas生成分享海报,然后将生成的海报图发送到朋友圈中来达到分享的目的。不过从基础库2.11.3开始,分享朋友圈的功能将渐渐开放,目前安卓平台已经支持,需要提前体验的小伙伴可以提前尝试下,实现的方式也很简单,具体如下:首先,页面需设置允许“发送给朋友”。具体参考Page.onShareAppMessage接口文档 满足条件 1 后,页面需设置允许“分享到朋友圈”,同时可自定义标题、分享图等。具体参考Page.o...原创 2020-07-28 09:40:56 · 2265 阅读 · 0 评论