小程序
addU
蓬生麻中 不扶而直 白沙在涅 与之俱黑
展开
-
小程序应用两个组件,vant和echarts层级覆盖问题(canvas会覆盖这些组件)
如图:在开发者工具上是没问题的,到真机调试,手机上就会出现echarts图表覆盖在下拉列表的上方,样式混乱不堪,然后就是寻找解决办法之路关于canvas原生组件问题小程序中canvas属于原生组件,显示的层级非常高,不受样式中的z-index限制;页面中有fixed的内容,还有弹窗组件(比如我使用的这个vant组件),canvas会覆盖这些组件;在模拟环境不会出现这个问题,我使用的小程序开...原创 2020-02-22 15:56:36 · 3181 阅读 · 9 评论 -
echarts去掉x轴的刻度线
需要的效果:axisTick: { show: false },原创 2020-02-07 11:26:52 · 9488 阅读 · 0 评论 -
echarts饼状图去掉外围折线指示内容的方法以及饼状图内部显示两行文字的方法
原图:需要的状态图:代码:itemStyle: { normal: { label: { show: false //隐藏文字 }, labelLine: { show: false //隐藏指示线 } }, ...原创 2020-02-05 19:13:09 · 3180 阅读 · 0 评论 -
小程序使用echarts图表的方式
小程序使用使用echarts的方法小程序项目中有需要用到折线图,饼状图,柱状图等等的时候,引用echarts是非常方便的,不过在使用的一些细节方面可就要认真阅读官方文档了,这里记录我在小程序中使用echarts的过程,仅供借鉴第一步:去github下载echarts对应的组件文件,它提供的是一个项目demo,可以参考自己所需要的 具体图表代码的,点击跳转github链接第二步:下好之后会有一...原创 2020-02-05 18:09:20 · 755 阅读 · 0 评论 -
树形结构的数据渲染问题(下面是个类似朋友圈回复的渲染)
页面要实现的效果图:开始静态页面是写了二层数组的遍历渲染方式,想偷懒就将数据进行处理(这里是小程序):wxml:页面用到了一些组件方法,这里不说这个,主要说渲染此类数据的方式,重点的dom代码在“回复盒子”下面<view class="consultBox" wx:for="{{consultList}}" wx:key="{{index}}"> <vie...原创 2020-01-16 18:11:15 · 483 阅读 · 0 评论 -
flex布局(弹性布局)盒子(列表)末尾排版出现空隙相隔过大的问题-图文式解答
先上图看看问题:原本的排版是:这个时候会出现两种情况:最后是两个产品或者三个产品,处理方式<!--productsList是我的列表数组,除4取余就得到最后剩几个模块-->:class="(productsList.length%4)==3?'three-product':''||(productsList.length%4)==2?'two-product':''"样...原创 2020-01-16 16:33:04 · 1941 阅读 · 0 评论 -
文本是连续的数字或字母出现不换行情况的处理,文字爬出界了||在uniapp上同样有效能强制换行
纯英文、数字、符号等的强制换行问题原创 2020-01-15 18:08:47 · 873 阅读 · 1 评论 -
小程序内用户帐号登录规范调整,登陆不符合审核规范
最近开发的小程序提交审核的时候,被打回,说是审核不符合规范:这里主要说明登陆问题,根据小程序2019.7.19发布的审核标准,有关登陆的要求,进入小程序直接要求登陆注册的方式是不被允许的,具体看:小程序内用户帐号登录规范调整和优化建议所以我将登陆页又多加了一个暂不登陆的,之前在入口处请求的消息中心的未读消息数量和购物车数量的接口请求加了条件,未登陆状态的用户查看浏览ok,涉及需要用户to...原创 2020-01-13 16:06:43 · 2414 阅读 · 0 评论 -
小程序 购物车(消息)tabs栏数字即时提示
实现的效果:主要是利用小程序的storage存贮数据,在app.js的onLaunch方法里// 计数 this.getCountInfo() //获取初始数量 setInterval(() => { this.changeCountInfo() // 调用修改数量的方法 }, 100);changeCountInfo() { // 计数 ...原创 2020-01-10 18:39:38 · 870 阅读 · 0 评论 -
小程序简单的下拉分页处理,利用的onReachBottom(页面上拉触底事件的处理函数)
挺简单的,就自己做了一个开关,控制是否下拉到最后一页,道理最后一页则关闭开关,第一页的时候打开开关,直接看代码吧data: { pageNo: 1, // 页码的递进数,当前页码 allPage: 1, // 总页数 canPull: true, // 下拉是否触发}getData(pageNo) { http.getRequest('/common/shop/c...原创 2020-01-10 18:12:33 · 1167 阅读 · 0 评论 -
小程序 官方文档的 swiper踩的一个坑 (图片不显示)
开发小程序的时候用到了官方的swiper,需要用到控制同时显示的数量这个属性,然后,就怎么也看不到图片显示了,仿佛背吃了。。。。。后面才找到原因,就是这个数量的值不能大于图片数组的长度,唉。。。。想想也是,就是没找到原因的时候感觉贼坑,找到原因了还是感觉坑!下面是页面代码:<swiper autoplay="{{autoplay}}" <!--主要是下面的判断数组长度...原创 2020-01-10 17:54:17 · 724 阅读 · 0 评论 -
小程序的图片上传以及文本文件上传 vant weapp van-uploader组件
此次小程序的文件上传用的是vant组件的上传,具体使用方法,查看官方文档更清楚一些,这里主要说一下本次的文本文件的上传遇到的问题。做文本上传的时候,我用的组件的accept属性规定上传文件格式,<van-uploader use-slot preview-image="{{false}}" file-list="{{ fileList }}" bind:after-rea...原创 2020-01-10 17:36:05 · 9630 阅读 · 15 评论 -
广告跳转方法,共有banner根据不同的typeId 跳转到不同的展示页面
经常有遇到整个网站的广告页随机出现在不同的banner处,这就需要一个比较统一的方法来实现跳转,我的代码如下:function adJump(type, id) { dataJson.map((item) => { // 遍历所有的页面比较type if (type == item.type) { console.log(item.url) wx.nav...原创 2020-01-10 17:10:38 · 2018 阅读 · 0 评论 -
小程序接口封装 wx.request从封装到使用
/** * function: 封装网络请求 * @url URL地址 * @params 请求参数 * @method 请求方式:GET/POST * @onSuccess 成功回调 * @onFailed 失败回调 */function request(url, params, method, onSuccess, onFailed) { wx.showLoading(...原创 2020-01-10 16:59:07 · 196 阅读 · 0 评论 -
小程序预览文本文件,以及遇到的问题(出现图片格式的文件预览处理方式)wx.downloadFile wx.openDocument
// 预览文本文件function looksDocument(url) { const type = url.split('.')[url.split('.').length - 1] // 截取文件后缀知晓类型.doc .txt wx.downloadFile({ url: url, //文件路径 header: {}, success: func...原创 2020-01-10 16:43:37 · 2244 阅读 · 0 评论 -
小程序微信支付,订单支付 wx.requestPayment 的使用
goPay() { // 支付 const openId = wx.getStorageSync("code") // 获取微信的code作为open ID传到后台 console.log(openId) // payType后台规定的支付方式,orderId 订单id http.postRequest('调后台的支付接口', { payType: 2, order...原创 2020-01-10 16:16:37 · 5939 阅读 · 0 评论 -
小程序图片点击放大效果封装,多张图片数组形式切换,wx.previewImage的使用
图片点击放大公共方法,当前点击的索引值index,和需要轮播的图片数组(集合)通过module.exports = { imgClick: imgClick, }导出,页面再导入就可以引用了var http = require('../../utils/util.js');使用方式http.imgClick(index, imgArr)这个挺简单的,手机使用的交互效果也不错,加上后图片...原创 2020-01-10 15:53:13 · 403 阅读 · 0 评论 -
小程序使用Vant Weapp的引用
vant weapp 的使用下载vant文件到本地:全局引用:也可以在页面单独引用,比如要在index里引用,只需在index.json申明即可:"usingComponents": { "van-popup": "vant/popup/index", "van-cell-group": "vant/cell-group/index", "van-button"...原创 2020-01-10 15:27:00 · 854 阅读 · 0 评论