![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
微信小程序
文章平均质量分 59
橙子_tong
坚持很容易,放弃却很难。
展开
-
小程序weui的使用指南
最近在开发小程序,使用到weui,在此记录一下weui的使用流程。WEUI 是什么WeUI 是一套同微信原生视觉体验一致的基础样式库。由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一。它最初是为了给在微信端页面提供一致的视觉体验而开发开源的一个样式库,后续随着小程序、企业微信等等的开放能力出现,WeUI也提供了小程序、企业微信等等的版本。我们将要介绍的,就是WeUI的小程序版本。预览weui的基础组件有很多,具体可以到 WEUI的官方,..原创 2021-04-22 14:17:08 · 1200 阅读 · 0 评论 -
微信小程序 - 组件化开发
微信小程序-组件化开发,总结一下开发过程:1、首先,在 miniprogram 文件夹下,创建一个组件:原创 2020-04-18 17:38:13 · 1773 阅读 · 0 评论 -
小程序里页面后退怎么刷新页面
开发小程序,遇到一个问题:我要去打开A页面,但如果没有登录,就会跳转到B页面。登录成功之后再次返回A页面,但是A页面没有刷新渲染页面。即后退刷新页面。刚开始以为是书写顺序,检查好几遍发现不是,根本原因是页面在返回之后没有刷新。那么怎么解决,查了好多资料。其实咱们小程序不存在页面刷新,只需要掌握好生命周期,那这个问题就OK了。比如判断是否登录, 可以在 onShow 函数里面写判断是...原创 2018-12-06 13:42:16 · 4669 阅读 · 1 评论 -
微信小程序解析富文本的几种方法:wxParse+rich-text
工作中有遇到过在小程序中需要解析后台管理系统设置的富文本内容,一,可以使用wxParse插件解析html使用方法1.在github中下载 下载地址 https://github.com/icindy/wxParse/tree/master/wxParse2.下载后复制到自己的小程序项目中3.设置全局样式 /**app.wxss**/ @import "...原创 2018-11-27 18:41:23 · 2407 阅读 · 0 评论 -
微信小程序中遍历---对象
最近在折腾微信小程序,遇到这么一个情况:后端返回一个key-value的对象数据,需要遍历对象的key-value,然后渲染到视图中。就像下面这样:{ '2018-1-9':{ address: '....', name: '....' }, '2018-1-10':{ address: '....', name: '....' },...原创 2018-11-27 11:51:40 · 4184 阅读 · 1 评论 -
微信小程序页面跳转传参
在需要页面之间传递多个参数的时候,需要用&链接起来,上一页的正确跳转代码如下:var that = this;wx.navigateTo({url: '../../pages/myListDetail/myListDetail?idx=' + that.data.currentTab + '¶meterId=' + that.data.parameterId+'...原创 2018-11-23 13:19:49 · 213 阅读 · 0 评论 -
微信小程序定义和调用全局变量globalData
如下:在全局文件app.js中定义全局变量,在子页面phone.js中获取1.现在app.js里面定义globalData对应的全局变量 2.然后在其他js文件进行调用。例如在photo.js里面ps: 要注意的是需要在文件开始的时候初始化 app这个对象 ...原创 2018-11-20 11:31:56 · 1151 阅读 · 0 评论 -
微信小程序radio单选框,再次点击取消
radio点击当前选项,取消选择,在网上尝试找了很多方法都不生效,通过给radio绑定一个点击事件(bindtap)来实现这一功能,直接看代码:<view class="page"> <view class="page__hd"> <text class="page__title">radio</text> ...原创 2019-02-19 11:01:20 · 3569 阅读 · 0 评论 -
微信小程序 单选框选中之后为什么取消不了?
1,radio-group是radio的父级组件,而你的代码wx:for循环了radio-group,所以事实上你的代码是有很多radio-group,而不是一组radios。故而你的radio按钮可以多选;2,之所以取消不了,是因为radio按钮本身所致,radio按钮本身的特性就是必须保持一个选中。...原创 2019-02-19 11:28:33 · 2786 阅读 · 0 评论 -
微信小程序---时间戳格式转换及函数封装
有时候我们会遇到,后台返回的时间是时间戳的形式,需要进行格式转换,如下:两种形式:1.封装好的 js,外部引入. 2.在需要的 js 文件中,封装单独函数。一、封装好的 js,外部引入.1、如图,将封装好的js文件放在项目公共目录中。 将上图中的 util.js 文件展开,看一下封装的函数内容。function formatDa...原创 2019-03-14 14:33:15 · 4015 阅读 · 0 评论 -
小程序报错 - setdata改变数据集时提示 For developer:Do not set same key “[object Object]“ in wx:key.
搭建微信静态页面时,自己写的假数据,用wx:for=""循环渲染的,结果。。。嗯。被绊住了。--- 起初是这样写的:<block wx:for="{{phoneOptions}}" wx:key="*this" wx:for-index='index' > <view class="phoneOpt {{optIndex == index?'acti...原创 2019-08-27 17:56:11 · 6082 阅读 · 0 评论 -
小程序报错:Component "pages/..." does not have a method "formSubmit" to handle even "submit"
在页面使用了 from+button 实现一个拖拽按钮,,控制台报错,如下:按照警示的大概意思,在这个页面不能使用formSubmit方法操作submit,那我去掉bindsubmit事件试试。嗯,去掉之后发现没有该报错了。页面wxml代码:<view class="feed" bindtouchmove="touchMoveChange" bindtouche...原创 2019-09-23 10:23:04 · 21269 阅读 · 2 评论 -
redirectTo、navigateTo与switchTab区别
redirectTo:关闭当前页,跳转到指定页;navigateTo:保留当前页,跳转到指定页;switchTab:只能用于跳转到tabbar页面,并关闭其他非tabbar页面。用法:wx.navigateTo({ url: '../pages/index/index', })跳转后面可以传参数:var my_real_name = 'isme';...原创 2018-11-20 11:24:37 · 2667 阅读 · 0 评论 -
微信小程序(二)_注册小程序账号
小程序是适合做什么?在业务层面,比如饿了么,点餐,点完之后就不会再用了。游戏,平时没事会打开玩一会,这类就不适合小程序。当然,小游戏类的除外。就是不用下载,打开就可以使用,方便。即用即走。就是用完就走。注册小程序账号?1.个人2.企业 打开mp.weixin.qq.com ---> 立即注册 --> 小程序 (邮箱激活)--> 主体类型:(个人...原创 2018-09-17 18:11:28 · 351 阅读 · 0 评论 -
微信小程序(三)_应用的生命周期
生命周期有应用的生命周期和页面的生命周期。我们先说一下应用的生命周期。我们都说,应用的生命周期是由小程序的逻辑层编写的,那逻辑层是由javascript编写,那生命周期应该写在哪里呢???生命周期,顾名思义就是整个小程序的开始与结束,因此应该放在项目根目录下的app.js中。首先,app.js中首先要有个小程序内置的函数app函数,即app(); app({}); 函数 //...原创 2018-10-11 13:22:48 · 208 阅读 · 0 评论 -
微信小程序(四)_页面的生命周期
说完应用的生命周期,我们来看一下页面的生命周期。顾名思义,页面的生命周期就是每一个页面的生命周期,那它有与应用的生命周期有何不同呢???首先,作用域不同:应用的是全局,页面的是本页面。其次,实例对象差异:应用App({}),页面Page({})。然后,是其中方法的作用域差异。Page({})的作用如下:PS:onLoad(){}方法,页面即将要加载了,做一些数据的初始化...原创 2018-10-23 14:15:31 · 148 阅读 · 0 评论 -
微信小程序(六)_控制属性 条件渲染 --- wx:if、hidden
条件渲染:wx:if在框架中,我们用户wx:if="{{condition}}",来判断是否需要渲染该代码块;也可以用 wx:elif 和 wx:else ,来添加一个 else 块;逻辑层:界面:显示 loading ,在2秒后消失,同时显示 load doneps:该需求,第一次是显示加载,2秒之后显示加载完成;来回切换的现象。 对于频繁被切换使用的...原创 2018-10-29 11:59:52 · 1742 阅读 · 0 评论 -
微信小程序(五)_数据绑定
数据绑定作为,逻辑与界面分离的框架当中,是一种不可或缺的部分,它的作用是,将逻辑层进过业务逻辑得到的数据呈现到界面上。小程序中跟这个基本一样,那有何不同呢,一起来看看。一、作用,数据绑定小程序中规定数据必须要放在一个固定的地方,就是该页面逻辑层的 data 属性中。页面的逻辑层就是该页面的 js 中,data:{ //该对象中的所有属性都可以在界面中访问到。 }语法:m...原创 2018-10-24 18:11:51 · 1250 阅读 · 0 评论 -
微信小程序(八)_事件处理
界面与逻辑层交互,第一:从逻辑层往界面层暴露数据;第二:界面层需要有一些行为用逻辑层处理,就用到事件机制。事件机制,在html中的事件机制是一样的,只是在小程序中有一些微小的变化。 小程序事件处理,通过标签的属性,指定事件处理的函数。bindtap="xx"eg:<button bindtap="tapHandle">click me</button>,...原创 2018-10-31 16:47:47 · 1216 阅读 · 0 评论 -
微信小程序(九)_单向数据流
单向数据流:指的是我们先把模板写好,然后把模板和数据(数据可能来自后台)整合到一起形成HTML代码,然后把这段HTML代码插入到文档流里面。优点:数据跟踪方便,流向单一,追寻问题比较方便【主要体现:微信小程序】。缺点:就是写起来不太方便,如果修改UI界面数据需要维护对应的model对象。图形解说: 例子:想要类似vue中,文本框内容改变时,绑定该数据的地方也随着改变;...原创 2018-10-31 17:56:06 · 1088 阅读 · 0 评论 -
微信小程序(十)_wxss与css
WXSS(WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式。WXSS 用来决定 WXML 的组件应该怎么显示。为了适应广大的前端开发者,WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序,WXSS 对 CSS 进行了扩充以及修改。与 CSS 相比,WXSS 扩展的特性有:尺寸单位 样式导入 尺寸单位rpx(respon...原创 2018-11-16 11:33:12 · 1351 阅读 · 0 评论 -
微信小程序(七)_控制属性 列表渲染2
控制属性:列表渲染即,数组类型的数据,去循环渲染。那先来看看怎么去遍历渲染一个数据中的数组=》逻辑层:界面层: 1.循环遍历 wx:for="{{ }}" 循环数组 2.循环变量 item.ps: 循环变量 item 如果和数据名称冲突,可以将循环变量改变。 那么如何改变???3.wx:for-item=...原创 2018-10-31 11:57:33 · 1220 阅读 · 0 评论 -
微信小程序背景图片不显示
1.写在 wxss 中的background-image 不显示。 2.<navigator url='' style='background-image:url(../../images/bj.png);background-size:18rpx 33rpx;'></navigator> 这样写,开发工具可以显示,但是在真机上不显示。...原创 2018-11-08 12:00:43 · 4532 阅读 · 0 评论 -
wx.getStorage异步和wx.getStorageSync同步区别
关于本地缓存1.wx.setStorage(wx.setStorageSync)、wx.getStorage(wx.getStorageSync)、wx.clearStorage(wx.clearStorageSync)可以对本地缓存进行设置、获取和清理。本地缓存最大为10MB2.localStorage 是永久存储一、异步缓存wx.setStorage(OBJECT)将数...原创 2018-11-20 15:57:50 · 68266 阅读 · 2 评论 -
微信小程序(一)_APPID_的作用
小程序APPID到底有什么用?答它相当于你的小程序在微信中的 ‘身份证’ ,有了它,微信客户端才能确定你的 ‘小程序’ 的身份,并使用微信提供的高级接口。那么小程序appid怎么获取?1. 先微信公众平台注册小程序2. 登陆小程序-设置-开发设置,复制APPID(小程序ID)appid有什么用?appID就像门牌,AppSecret就像钥匙。AppID可以公开,但是Ap...原创 2018-09-17 14:42:11 · 7070 阅读 · 0 评论