微信小程序
前端J先生
三千弱水,只取一瓢饮,独爱一人,岗位千千万,惟爱前端!!!
展开
-
微信小程序常用方法
【代码】微信小程序常用方法。原创 2022-12-09 10:56:00 · 246 阅读 · 0 评论 -
微信小程序拖拽实现(真实测试管用)
//js// 是否拖拽的标记var isClick = false;// 初始化起点var StartX,StartY;// 拖拽结束的终点var EndX,EndY;Page({ data: { // Y轴最小值/初始值 topMin:508, //X轴最小值/初始值 leftMin:0, //top值 top:508, //left值 left:0原创 2022-01-24 20:13:59 · 4131 阅读 · 0 评论 -
微信小程序下载代码
下载API.file=function(url,fileName){ url = baseURL +'/v1/file/image?url='+ url; let newPath=`${wx.env.USER_DATA_PATH}/${fileName}`; const File= wx.getFileSystemManager(); return new Promise((resolve,error)=>{ wx.downloadFile({ url: url, suc原创 2021-12-29 21:07:09 · 2160 阅读 · 0 评论 -
微信小程序scroll-view横向滚动和纵向滚动实现(亲测管用)
微信小程序横向滚动//wxml <scroll-view scroll-x="true" style=" white-space: nowrap; display: flex" scroll-into-view="{{rightId}}" > <view style="display: inline-block">1</view> <view style="display: inline-block">2</原创 2021-12-27 20:29:30 · 14064 阅读 · 0 评论 -
微信小程序的奇淫巧技
微信小程序销毁当前页面wx.redirectTo({ url:'/pages/index/index' })onUnload(){let pages = getCurrentPages().length - 1; wx.navigateBack({ delta: pages })}原创 2021-12-27 15:55:42 · 222 阅读 · 0 评论 -
小程序默认button样式去除
很多人开发小程序的时候,会因为button难看的样式而烦恼// 去除默认样式button {position:relative;display:block;margin-left:auto;margin-right:auto;padding-left:14px;padding-right:14px;box-sizing:border-box;font-size:18px;text-align:center;text-decoration:none;line-height:1;.原创 2021-04-20 16:31:09 · 336 阅读 · 0 评论 -
微信小程序打开腾讯地图页面进行导航
这是打开导航页面进行导航 wx.chooseLocation({ success: function(e) { //开定位操作 console.log('res',e); }, fail: () => { //不允许打开定位 wx.getSetting({ success: (res) => { if (!res.authSetting['scope..原创 2021-04-20 11:16:08 · 1171 阅读 · 0 评论 -
微信小程序定位功能开启,获取当前位置的经纬度
app.json必须写 "permission":{ "scope.userLocation":{ "desc":"即将获取到你的位置信息" } },放到使用定位的页面中 // 定位操作 isAuth: function(e) { // 获取位置信息 wx.getSetting({ success(res) { //这里判断是否有定位权限 if (!res.authSettin.原创 2021-04-19 18:28:59 · 652 阅读 · 3 评论 -
微信小程序报错:VM16299 WAService.js:2 RangeError: WebAssembly.instantiate(): Out of memory: wasm memory
VM16299 WAService.js:2 RangeError: WebAssembly.instantiate(): Out of memory: wasm memory//内存不足把版本降低一下,但是不要降低太多即可修复!!!原创 2021-04-12 15:31:17 · 1426 阅读 · 0 评论 -
微信小程序跳转页面返回后携带参数返回
问题:微信小程序里面有需要点击跳转到其他页面,然后选择完数据后在把数据携带过来并返回解决方案:在页面卸载的周期函数中,写函数进行调用//a页面跳转到b页面,到b页面选择完数据之后需要携带参数返回a页面并使用//b页面//监听页面卸载 onUnload: function () {// 携带参数返回this.navigation() }, //这边发送的是请求,我这边暂用data代替 navigation(){ //发送请求let data={ page:1, .原创 2020-12-31 17:51:48 · 1261 阅读 · 0 评论 -
微信拖拽盒子movable-view点击事件失效问题
<movable-area > <movable-view > <view bindtap="audioPlay"> 111 </view> </movable-area > </movable-view > 这样写是不过用的,尝试了很多种方法,z-index,catchtap,等等方法,后来经过仔细分析,这个盒子..原创 2020-12-22 20:31:50 · 1410 阅读 · 0 评论 -
微信小程序加载图片闪烁bug解决方案(亲测有效)
小程序图片闪烁是因为图片没有高度,加载时从第最高高度变到最适合高度的过程,解决方案有三种,我是使用的第一种第一种image{height:auto}//全局设置图片自适应,完美解决第二种 未解决我当前的问题让图片显示完在触发的事件bindload//wxml <image style="height:{{Flag?null:imageheight}}rpx;" bindload="showload"></image> //js showload(res.原创 2020-12-18 10:09:01 · 8898 阅读 · 3 评论 -
微信小程序等候加载使用
使用场景请求数据开始请求前 wx.showLoading({ title: '加载中', }) 请求完毕 wx.hideLoading()原创 2020-12-17 15:12:07 · 1642 阅读 · 0 评论 -
微信小程序传参方法最全面
微信小程序传参分为几种第一种通过跳转地址携带参数进行传参,通过data自定义属性进行传参a页面//wxml <view data-url="/pages/user/public/feedback/index" data-urlid='0' bindtap="authenJump"> <button>意见反馈 </button> </view>a页面//js文件 这里携带的是urlid url是跳.原创 2020-12-11 11:56:18 · 1632 阅读 · 0 评论 -
微信小程序双向绑定(详细教程!!!)
微信小程序是单项数据流,所以很多时候特别不方便,以下代码可以实现微信小程序的数据双向绑定通过input框自带的输入属性bindinput进行输入就调用getInput的方法,value是当前显示的值//wxml<input type="text" value='{{message1}}' bindinput='getInput'/>//js data: {// 一条信息message1:""},getInput(e){ this.setData({ mes.原创 2020-12-09 15:27:47 · 2543 阅读 · 0 评论 -
微信小程序真机调试rweieceivederrorcodereceived error code-50005错误状态码50005
微信小程序真机调试错误状态码50005原因:调试过于频繁,半小时后在测试即可恢复原创 2020-12-02 16:50:46 · 4355 阅读 · 3 评论 -
微信小程序自定义组件Component is not found in path components weimo tabbar index using by pages index inde
报错原因:components 本质上还是pages,所以需要在aap.json添加上即可附上解决过程·:大家看到这个报错是不是先想到的是componets下面的tabbar或者pages下面的index错误,我去俩个文件夹查找文件并未发现错误componets下面的tabbar配置//tabbar/index.jsom{ "compenent":true, "usingComponents": {}}pages下面的index这是引入tabbar组件的页面 //.原创 2020-12-02 15:41:32 · 3043 阅读 · 0 评论 -
微信小程序的异步请求
很多时候我们需要到异步请求但又不知道怎么写,异步请求主要是处理同步请求卡顿的问题实现逻辑:通过return一个promise对象来实现异步,对象里面写一个请求即可 return new Promise((resolve,reject)=>{ 发送请求代码 })...原创 2020-12-01 20:14:53 · 470 阅读 · 0 评论 -
微信小程序返回数据不渲染
第一次使用微信小程序,遇到了这个问题,后来经过大佬指导,才了解到,由于微信小程序是单向数据流,所以必须通过setData方法把数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)res => { res.data.map(res => { this.data.userList.push(res) }) this.setData({ userList:this.data.userList }) .原创 2020-12-01 16:16:48 · 1568 阅读 · 0 评论 -
微信小程序的模态框制作(最详细)
实现逻辑:通过if进行判断显示还是隐藏,盒子通过fixed定位加层级权重进行显示,在通过 overflow: hidden;防止溢出catchtap="stop"是为了防止冒泡//wxmlview class="modal-dialog" wx:if="{{showModal}}" bindtap='hidepopup'> <view class="screen" catchtap="stop"> </view></view>.原创 2020-12-01 09:00:58 · 1794 阅读 · 2 评论 -
微信小程序阻止冒泡和捕获
实现思路:通过微信小程序原生的api,让点击之后触发函数即可,函数一定要给空,不给空不会阻止<view class="modal-dialog" bindtap='hidepopup'> <view class="screen" catchtap="stop"> </view></view>catchtap="stop"阻止冒泡与捕获stop(){}...原创 2020-11-30 17:36:15 · 1718 阅读 · 0 评论 -
微信小程序实现页面跳转并可以返回上一层方法
实现逻辑:通过自定义的data属性,存储进去自己想要跳转的页面,通过bindtap点击事件传递进去的event事件获取到data里面自定义属性里面的属性值,然后进行跳转//静态页面代码 <view data-url="/pages/user/voice_actor/authen/index" bindtap="authenJump"></view> //动态代码 authenJump(e){ wx.navigateTo({ url.原创 2020-11-28 15:35:54 · 4819 阅读 · 5 评论 -
小程序原生轮播图
竖向轮播 <scroll-view scroll-y="true" style="height:100%;" >//里面放view </scroll-view >横向轮播//横向轮播必须加的属性:style="width: 100%;height: 100%;因为要宽不设限制,高要随父盒子//white-space: nowrap;不能换行,里面的view必须给css属性display:inline-block;让他们并行显示 <scroll-vi.原创 2020-11-19 18:44:48 · 325 阅读 · 0 评论 -
微信小程序如何引入公共组件
在原生小程序开发里面,在componets里面写好的公共组件如果向引用,需要在想引入的页面的json文件中//想要使用自定义公共组件首先要在页面的 json 文件中进行引用声明。//此时需要提供自定义组件的标签名和对应的自定义组件文件路径:{ "usingComponents": { "component-tag-name": "path/to/the/custom/component" }}...原创 2020-11-19 17:51:53 · 2256 阅读 · 1 评论 -
微信小程序不支持背景图片问题
微信小程序支持俩种图片格式:第一种:原创 2020-11-17 13:52:50 · 1553 阅读 · 0 评论 -
小程序软键盘距离输入框无边距的问题
小程序软键盘跟输入框无距离问题通过添加一句代码解决原创 2020-11-04 10:12:31 · 405 阅读 · 0 评论 -
input层级过高穿透的解决方案!!!
未解决之前:解决之后:因为微信小程序默认就是原生组件camera、canvas、input(仅在focus时表现为原生组件)、live-player、live、pusher、map、textarea、video的层级是最高的,官方的解决方案也不行,最后通过几行代码解决。把下面那个层级较低的盒子,给他固定定位,定位到屏幕下方,层级设高一点就行了 position: fixed; left: 0; bottom: 0; z-index: 9999;...原创 2020-10-16 19:23:48 · 2738 阅读 · 1 评论 -
uniapp转微信小程序编译报错 Bad attr `data-event-opts` with message
Bad attr `data-event-opts` with message> 1 | <view class="activityContent data-v-74e8dc3a">> <view class="poster_img_outside data-v-74e8dc3a" data-event-opts="{{index==setdata?animdata:{}}}">> <image src="{{imgSrc}}" mode class=原创 2020-10-16 10:08:27 · 11806 阅读 · 2 评论