微信小程序
wy_Blog
学习源于点滴的积累
展开
-
小程序上拉加载onReachBottom不触发
1、检查配置对应的config配置文件export default { enablePullDownRefresh: true,}2、查看是否有重复的onReachBottom 被覆盖3、css页面高度height去除.skuBuyFeed { background-color: #121212; width: 100vw; // height: 100vh; padding-top: 80px; overflow-y: auto;}...原创 2021-10-26 17:58:56 · 596 阅读 · 0 评论 -
微信小程序tabBar底部导航 不显示问题解析
搞了好久原来是位置的原因唉闹心直接上代码:出不来的代码:{ "pages": [ "pages/splash/splash", "pages/zhuye/zhuye", "pages/list/list", "pages/item/item", "pages/search/search", "pages/profile/profile原创 2017-03-22 15:25:39 · 16816 阅读 · 0 评论 -
小程序页面跳转解析
对于两个或更多页面的微信小程序而言,页面之间的跳转是在所难免的。有关小程序页面间跳转的 API 函数,微信一共为我们提供了 4 个(另外,还有返回上一级或多级的 wx.navigateBack)。下面,我将主要围绕这四个 API 函数,教你如何跳出页面跳转的大坑。四个接口怎么用?这四个 API 可接受的参数都是完全相同的,如下:在小程序 JavaSc转载 2017-10-27 13:41:00 · 2510 阅读 · 0 评论 -
微信小程序层级问题
在小程序里面map组件是层级最高的,所以设置z-index是没有用的小程序中 canvas、textarea、video 等组件使用原生渲染,如果需要弹层交互的话它们会挡住弹层。解决办法就是在弹层后将这些组件 hidden 属性设置为 true,弹出消失时重置为 false 即可。另一个问题是如果这些组件在弹层内,它们不会限制在弹层中,而是会随着页面整体进行滚动。原创 2017-11-16 15:12:48 · 19657 阅读 · 0 评论 -
微信小程序获取手机号
小程序中有很多地方都会用到注册用户信息的地方,用户需要填写手机号等, 有了这个组件可以快速获取微信绑定手机号码,无须用户填写。1.getPhoneNumber这个组件通过button来实现(别的标签无效)。将button中的open-type=“getPhoneNumber”,并且绑定bindgetphonenumber事件获取回调。 2.在使用转载 2018-01-17 09:36:23 · 4994 阅读 · 0 评论 -
微信小程序优化瘦身可通过 WeCOS 实现
尽管 4 月份微信官方将小程序的大小限制从 1M 放开到 2M,但是对于使用大量图片的小程序(电商等)来说,2M 的限制还是显得拮据。基于这种场景,腾讯云微信小程序解决方案团队开发了 WeCOS 小程序瘦身工具,依托腾讯云强大的云对象储存(COS),提供自动将小程序内部的图片自动上传到 COS,并将图片的相对路径改为线上 URL,这样就可以大大的缩减小程序的大小,并且无需过多繁琐的上传步骤。现在我...转载 2018-02-26 10:11:40 · 2620 阅读 · 1 评论 -
微信小程序iphone x适配
微信小程序在适配iphone x 的时候 底部的横线会出现遮挡这时候就要处理下:在app.js文件中 创建全局变量,然后获取设备型号 globalData: { isIphoneX: false, userInfo: null }, onShow:function(){ let that = this; wx.getSystemInfo({ ...原创 2018-03-02 13:30:33 · 9408 阅读 · 0 评论 -
微信小程序定位当前城市
定位获取当前所在城市直接上代码Page({ data: { city: '' }, onLoad: function (options) { this.loadInfo(); }, loadInfo: function () { var page = this wx.getLocation({ type: 'wgs84', ...原创 2018-06-21 16:50:50 · 5027 阅读 · 0 评论 -
怎么判断进入小程序的途径
在 app.js的onShow 方法里进行获取 onShow: function (options) { let option = JSON.stringify(options); console.log('app.js option-----' + option) console.log('app.js--------------------...原创 2018-08-22 15:11:48 · 4150 阅读 · 0 评论 -
微信小程序表单验证form提交错误提示
表单验证不能为空错误提示WXML:{{popErrorMsg}} 你还可以输入 {{commentTxtCount}} 字 确认发布WXSS:page{background: #f4f4f4;}.ad_popHd{height: 76rpx; line-height: 76rpx; fo原创 2017-05-18 13:44:55 · 13415 阅读 · 2 评论 -
微信小程序地图定位
一个地图的小例子分享下效果图:这是wxml文件中地图部分的代码 这是js代码 data: { markers: [{ iconPath: '/images/icon-location.png', id: 0, latitude: 39.970830, longitude: 116.410440,原创 2017-08-23 17:18:11 · 3600 阅读 · 0 评论 -
微信小程序变量值共用小技巧
举个例子,比如从商品管理列表页,相对自己发布的商品进行修改,点击修改按钮,通过 activityId 唯一标识进行修个这个商品, 这个activityId 我们可以通过 页面跳转传值,在 onLoad 里获取到,例子: onLoad: function (options) { var activityId = options.activityId; //获取值 this.d原创 2017-07-11 17:07:13 · 9332 阅读 · 0 评论 -
微信小程序点击高亮显示
第一种方法:cursor: pointer;第二种方法:可以用 navigator 标签进行包裹 ,就会默认有点击高亮效果;去除默认点击高亮 在标签内加入 hover-class="none"也可以进行自定义颜色/** wxss **//** 修改默认的navigator点击态 **/.navigator-hover { color:blue;}/** 自定原创 2017-03-21 16:40:58 · 9349 阅读 · 0 评论 -
微信小程序点击添加移除class
微信小程序点击添加移除class类实现动态变化classwxml: 北京 上海 wxss:.location_bottom{height: 140rpx;line-height: 140rpx;color: #d91f16;font-size: 28rpx;border-top: 2rpx #ebebeb solid;原创 2017-05-15 13:24:50 · 5209 阅读 · 2 评论 -
微信小程序锚点定位楼层跳跃
微信小程序实现楼层锚点跳跃,点击不同的锚点进行位置跳跃:利用:scroll-into-view 来实现效果图如下:WXML: {{item.region}} {{item.name}} 自动定位 {{item.region}} WXSS:page{ h原创 2017-05-16 13:21:57 · 4579 阅读 · 0 评论 -
微信小程序缓存,根据不同的id来进行设置和读取缓存
本文是根据不同的id来进行设置和读取缓存,才去的是同步缓存的方式:jonNums.count 是接口返回的数据 是报名总人数newNumber 新的报名总人数 - 缓存上次的报名总人数 = 新增报名人数 wx.request({ url: domain + '/activityjoin/selectJoinCount', data:原创 2017-06-10 16:11:56 · 4048 阅读 · 0 评论 -
微信小程序tabbar的跳转问题
如果在app.json 配置tabbar 的时候配置了 跳转的页面的链接;在其余的子页面,设置用navigator 进行跳转会发现 在tabbar 设置过的页面无法进行跳转,这时需要在navigator 里加上open-type="switchTab"例如:原创 2017-06-15 15:46:35 · 6041 阅读 · 1 评论 -
微信小程序navigator的open-type跳转问题
navigator的open-type属性 可选值 'navigate'、'redirect'、'switchTab',对应于wx.navigateTo、wx.redirectTo、wx.switchTab的功能open-type="navigate"等价于API的 wx.navigateTo 而wx.navigateTo的url是需要跳转的应用内非 tabBar 的页面的路径op原创 2017-04-17 23:51:23 · 38762 阅读 · 3 评论 -
微信小程序横向左右滑动案例
左右滑动效果图片自己相应的填进去就好了效果图:wxml文件:原创 2017-04-19 08:52:10 · 13702 阅读 · 17 评论 -
微信小程序,新添加的元素保持再底部
点击添加按钮,新添加的元素保持在底部小demo的实现WXML代码:添加 item {{index}}--{{item.place}} WXSS代码:page{height: 100%;}.scroll{height:400rpx; border: 2px solid #f00;}.item{ background: #ddd; marg原创 2017-05-04 15:32:27 · 12801 阅读 · 1 评论 -
微信小程序官方文档请求接口调用报错
官方文档的请求是这样的wx.request({ url: 'test.php', //仅为示例,并非真实的接口地址 data: { x: '' , y: '' }, header: { 'content-type': 'json' }, success: function(res) { console.log(res.data)原创 2017-03-21 11:55:36 · 2249 阅读 · 0 评论