![](https://img-blog.csdnimg.cn/20210824165302699.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
🌲微信小程序 🌲
文章平均质量分 58
实战总结微信小程序开发的经验,
张清悠
学会不为过程的缓慢而焦虑,即使暂时未能如你所愿,但只要你在努力,你就在不断成长!
展开
-
如何获取微信小程序picker为值而不是下标(仅需一行代码实现)
前言:近期写一个微信小程序form表单提交的页面,在用到文档中的pick选择器中,发现获取只能成下标,导致与后端交互很不好,于是研究了一下,具体实现请看下面,先附上官网地址:微信小程序表单组件picker一、直接上步骤官网上面有很多类型例:普通选择器、多列选择器、时间选择器、日期选择器、省市区选择器等等…参数解析1.xhtml部分 <view> <picker mode="selector" range="{{shoparray}}" ran原创 2021-10-13 16:43:27 · 1405 阅读 · 0 评论 -
微信小程序接收富文本编辑器图片大小解决方法
一、先上案列:1.图片没有尺寸影响整体布局二、改完之后:三、上代码展示1.wxml<!--pages/articleInfo/articleInfo.wxml--><view class="articleInfo padding15"> <rich-text nodes="{{articleInfoArray}}"></rich-text></view>2.js //请求协议接口 wx.request({原创 2021-09-16 14:42:54 · 831 阅读 · 0 评论 -
微信小程序获取日期补零和比较时间大小提示不同
if (res.data.data == "success") { var startDate = res.data.taskTypeList[0].startDate //获取接口返回开始日期 var kstartTime = res.data.taskTypeList[0].startTime //获取接口开始时间 var zongtime = kstartTime.slice(0, 2) //截取接口开始时间前两位例 09:00 取0...原创 2021-09-11 11:13:16 · 1271 阅读 · 0 评论 -
微信小程序根据日期和时间进行排序
一、前言最近接手了一个小程序的项目,有这样一个需求要对列表进行日期和时间的排序,于是小试牛刀,操作了一番,终于搞出来,在这里给大家总结分享一下经验,希望对大家有一定的帮助。二、需求分析(这是已完成的效果)这里有具体的日期时间和具体的小时时间,后端数据给我传来的是 这样式的startDate: "2021-08-27" //日期年月日startTime: "10:15" //开始时间endTime: "20:00" //结束时间三、具体实现代码 // 根据日期排序 compar原创 2021-08-24 16:50:05 · 3405 阅读 · 2 评论 -
微信小程序常用指令
赋值wx:for for循环wx:if判断双向数据绑定 set.Data点击事件加减js代码text标签image标签原创 2020-12-16 01:17:33 · 2100 阅读 · 1 评论 -
小程序报错navigateTo跳转问题
解决报错(in promise) MiniProgramError {“errMsg“:“navigateTo:fail can not navigateTo a tabbar page“}今天学习了小程序实现路由跳转,我在操作的时候在控制台出现以下错误信息。问题原因:经过查阅资料,知道使用navigateTo路由跳转方式,保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。解决办法:只需在js文件的点击事件中,配置跳转的url地址与tabbar中的跳转地址不一样就ok.我就原创 2020-09-17 17:10:17 · 3091 阅读 · 1 评论 -
微信小程序的常见注意事项
1、button按钮不能自定义样式因为你写了type属性,只要不写type属性,可随意变更button样式2、tabBar页面,不能跳转页面,只能用switchTab来跳转3、微信小程序主包里面包含:默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本如果主包和分包都要用到的公共资源都大于了2M,只能想办法将能用远程的公共资源都放到远程里4、生成小程序不能用ID选择器,要用class5、 小程序的周期函数不能用在子组件里面,要用到父组件里面6、小程序没有window对象原创 2020-08-15 20:33:28 · 599 阅读 · 0 评论 -
微信小程序常见的小bug,是否引起您的注意
1、去除小程序button的默认样式button.remove-btn-style{ outline:none; border:none; list-style: none; border-radius:0;}button.remove-btn-style:after{ outline:none; border:none; list-style: none;}2、这种错误多半是该js文件中没有Page这个方法,就算是空的js也必须要把Page({ })写上去3、这原创 2020-08-14 20:48:27 · 1845 阅读 · 0 评论 -
web前端小程序开发的部分重要点
1. bindtap和catchtap的区别是什么?bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒泡事件向上冒泡2、 微信小程序的相关文件类型。小程序:pages ——index:index.js(页面逻辑) /index.wxml (页面结构)/index.wxss (页面样式表) / index.json (页面配置)App.js 小程序逻辑App.json 小程序公共设置App.wxss 小程序公共样式表3、小程序参数传值的方法1、设置id的方法标识跳原创 2020-08-13 21:05:09 · 1363 阅读 · 0 评论 -
小程序vant popup弹出层阻止底层页面滑动
前言在小程序编写过程中使用使用vant weapp的popup组件做小程序的弹出层,触屏导致底层页面跟着滑动。解决方法使用touch事件阻止属性,@touchmove.stop.prevent指向空事件van-popup( :show="popupShow" :z-index="999" position="bottom" @close="popupClose" @touchmove.stop.prevent="moveHandle") methods: { moveHan原创 2020-08-10 21:04:44 · 2765 阅读 · 2 评论 -
微信小程序登录授权详细流程介绍
微信小程序登录授权需求介绍:需要登录授权的页面必须要传递token哪些页面需要token商品中详情页:收藏,加入购物车我的:购物车页面token值从哪里来?1.何为token:前端鉴权的一种方式,token由后端生成,token是有时效性2.微信小程序登录授权拿到token第一步:登录流程参考文档:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.htmlwx.login()–原创 2020-08-08 20:40:21 · 2839 阅读 · 0 评论 -
小程序解析富文和ajax的封装
- 解析富文本wxParsegithub地址:https://github.com/icindy/wxParse使用方法:1.下载github官方wxParse目录到小程序项目的根目录下文件结构:wxParse/-wxParse.js(必须存在)-html2json.js(必须存在)-htmlparser.js(必须存在)-showdown.js(必须存在)-wxDiscode.js(必须存在)-wxParse.wxml(必须存在)-wxParse.wxss(必须存在原创 2020-08-08 20:29:02 · 182 阅读 · 0 评论 -
微信小程序 - Vant框架引入 Toast (轻提示)
前言官网介绍的不太清楚,这里记录一下。第一步在所在页面的 xx.json 文件中引入,注意路径:"usingComponents": { "van-toast": "@vant/weapp/toast/index"}第二步在所在页面中 xx.js 文件中引入,注意路径!import Toast from '@vant/weapp/toast/toast';第三步在所在页面中 xx.wxml 文件中放入以下组件,注意路径!<van-toast id="van-toast转载 2020-08-08 17:24:21 · 4755 阅读 · 0 评论 -
小程序引入第三方插件Vant和小程序WeUl组件库
Vant小程序组件1、自己封装的gitee Vant链接:https://vant-contrib.gitee.io/vant/#/zh-CN/点击切换小程序成功后就会看到 小程序Ul组件库构建 npm 包打开微信开发者工具,点击 工具 -> 构建 npm,并勾选 使用 npm 模块 选项,构建完成后,即可引入组件引入在 app.wxss 中引入内置样式@import '@vant/weapp/common/index.wxss';例子:需在创建的pages的目录中的文件夹原创 2020-08-07 20:32:16 · 1977 阅读 · 0 评论 -
微信小程序开发组件的使用(三)
1、开发组件三要素 properties //相当于vue中的props接收属性 triggerEvent //相当于vue中的$emit slot //和vue是类似的slot 1.可以通过slot为自定义组件嵌入wxml结构 2.默认一个自定义组件只能嵌入一个slot,如果嵌入多个slot必须要开启options中的multipleSlots 例如: Component({ options:{ mul原创 2020-08-06 19:52:03 · 327 阅读 · 0 评论 -
微信小程序事件流、生命周期以及组件(二)
一、事件流事件冒泡:从点击的元素开始触发,向上事件传播阻止事件冒泡:event.stopProPagation()事件捕获:多上级元素传递,传递到最具体的元素btn.addEventListener('click',function() {//回调},true)二、小程序中事件冒泡和阻止冒泡bind+事件名="方法名" 向上传递事件,即事件冒泡catch+事件名="方法名" 阻止事件冒泡三、小程序生命周期1. 整体小程序的生命周期:```App({ onLaun原创 2020-08-05 19:21:51 · 300 阅读 · 0 评论 -
前端初学者小程序教学(一)
一、了解微信小程序微信小程序,小程序的一种,英文名Wechat Mini Program,是一种不需要下载安装即可使用的应用 张小龙发布时间2017年1月9日二、微信小程序和普通H5的区别微信小程序用开发者工具来查看预览页面,H5用浏览器来查看渲染页面微信小程序扩展了底层能力,H5调用底层能力比较弱微信小程序没有完整的JS API,但H5拥有完整的JS API(EcmaScript,DOM,BOM)开发能力渲染机制不同:微信小程序渲染线线程和逻辑线程是独立并行运行的,而H5只是一个线程原创 2020-08-04 19:42:52 · 671 阅读 · 0 评论