微信 小程序
关注
分享
扫一扫
yechaoa
优快云博客专家、掘金签约作者、infoQ 专家博主、阿里云专家博主、51CTO专家博主、华为云云享专家；现就职于阿里巴巴，研究方向包括但不限于大前端、端基础架构与中间件、性能优化等。
展开
-
微信小程序目录结构、事件处理、网络请求
微信小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。一.目录结构pages同级目录是全局的配置，1.app.js里面是一些全局的函数，比如获取用户信息（微信头像用户名）2.app.json是全局的配置（有点像android中的manifest），还有窗体的color、title等3.app.wxs原创 2016-11-03 18:47:23 · 1098 阅读 · 0 评论 -
微信小程序 地图定位、选址，解决regionchange重复调用
效果：需求定位到当前位置，并查询周边的地址显示到列表中，且地图可以拖动选取位置实现1，在wxml中添加视图view<map id="map" longitude="{{myLongitude}}" latitude="{{myLatitude}}" scale="18" bindcontroltap="controltap" markers="{{ma原创 2018-08-24 12:07:08 · 10812 阅读 · 10 评论 -
微信小程序 js中遍历list
wxml 遍历用 wx:forjs:for (var index in res.data) { title : res.data[index].title }res.data是数组，index是下标原创 2018-08-28 22:16:31 · 49833 阅读 · 11 评论 -
微信小程序 返回上一页并传参
itemClick: function(e) { let pages = getCurrentPages(); let prevPage = pages[pages.length - 2]; prevPage.setData({ message: e.currentTarget.dataset.ms...原创 2018-08-29 14:08:58 · 22681 阅读 · 1 评论 -
微信小程序 日期比较，计算天数
checkDate: function(startTime,endTime) { //日期格式化 var start_date = new Date(startTime.replace(/-/g, "/")); var end_date = new Date(endTime.replace(/-/g, "/")); ...原创 2018-10-24 11:53:29 · 16334 阅读 · 1 评论 -
Android APP拉起小程序、分享小程序、小程序打开APP
配置参考：https://blog.youkuaiyun.com/yechaoa/article/details/78469539APP拉起小程序 private void launchMiniProgram(String path) { String appId = "你的appid"; // 填应用AppId IWXAPI api = WXAPIFactory.cr...原创 2018-11-07 12:09:19 · 11463 阅读 · 2 评论 -
微信小程序 关闭当前页面
wx.redirectTo(Object object)关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。 wx.redirectTo({ url: '../index/index' })原创 2018-12-16 22:36:27 · 34310 阅读 · 1 评论 -
【整理篇】微信小程序开发注意事项
以前的笔记。1.wx.navigateTo 和 wx.redirectTo 不允许跳转到 tabbar 页面，只能用 wx.switchTab 跳转到 tabbar 页面2.项目根目录下的app.json文件中的pages，第一个路径就是默认启动最先打开的页面3.编辑器左下角有当前页面路径，可 复制/打开4.我们通常会在事件中获取数据，e.target.currentTarget.t...原创 2019-02-28 15:10:37 · 1297 阅读 · 0 评论 -
小程序警告：Now you can provide attr `wx:key` for a `wx:for` to improve performance.
文章目录问题解析解决示例问题当我们在使用wx:for遍历列表数据的时候，可能会遇到以下警告：Now you can provide attr `wx:key` for a `wx:for` to improve performance.解析字面意思呢，缺少wx:key属性，不过既然是警告，也就表示可有可无，那为什么警告呢？当我们在使用wx:for遍历列表数据的时候，原则上来讲每条数...原创 2019-09-18 00:05:57 · 23451 阅读 · 0 评论 -
微信小程序 颜色渐变
效果：style：button[type=primary] { background: linear-gradient(to right, #03A9F4, #7C4DFF); }注意这里要使用background，而不能用background-color。语法：同css一样:linear-gradient( color1 , color2 );默认从上...原创 2019-09-24 16:52:04 · 1872 阅读 · 0 评论 -
微信小程序 滑动到顶部
效果：点击上图中右下角的图标滑动到顶部。其实很简单，但也有一些小细节。1.确定图标按钮的位置使用绝对位置使其固定在右下角的位置。wxml:<icon type="download" size="45" color="#4caf50" bindtap='scrollTop'/>这里使用官方的下载图标，然后修改了一下颜色。wxss:icon[type=downl...原创 2019-09-27 20:06:46 · 1754 阅读 · 0 评论 -
微信小程序 定时器setInterval、setTimeout，简单易用
使用场景：获取验证码1，data中定义参数data: { color: "#ff6f10", disabled: false, getCode: "获取验证码",},2，wxml中的引用<button size="mini" type="default" plain="true" class='form-code-btn' bindt..原创 2018-08-23 18:13:07 · 74954 阅读 · 5 评论 -
微信小程序 动态修改颜色
在h5中可以用js根据id啊、class啊等等找到控件，然后.css 但是在小程序中没有，小程序是数据绑定的模式，style也可以这样写1，在data中定义变量colordata: { color:"#ff6f10",},2，在控件中使用style='color:{{color}};'3，在需要的场景下修改data中的color即可...原创 2018-08-23 17:49:31 · 15010 阅读 · 2 评论 -
微信小程序 腾讯地图逆地址解析reverseGeocoder之poi_options
需求呢，是根据经纬度查附近的地点什么的，小程序自带的map组件又没有这个功能，然后就接入了腾讯地图… poi_options呢是这个方法的请求参数之一，看下文档：有取值范围啊、page啊什么的，这里要说的是怎么给poi_options赋值…必须是String类型，不是对象类型参数不能有空格多参数用分号分隔所以实际上应该是这样的：poi_options:...原创 2018-08-23 12:43:59 · 20006 阅读 · 2 评论 -
微信小程序注册流程详解
微信小程序注册需要的材料：1.在微信公众平台官网首页（mp.weixin.qq.com）点击右上角的“立即注册”按钮。2.选择小程序3.填写账号信息4.邮箱激活5.选择主体类型并填写主体信息管理员身份验证，需要绑定银行卡的微信账号扫描二维码验证，虽然不扣钱。（管理员权限较高，验证较复杂）注册方式如果选择原创 2017-01-10 15:02:50 · 6742 阅读 · 0 评论 -
微信小程序 网络请求封装
封装的意义在于使用起来更高效简洁network.jspost请求和get请求不一样的地方在于header中的content-type参数和method参数function postRequestLoading(url, params, message, success, fail) { if (message != "") { wx.showLoa...原创 2018-07-27 13:56:32 · 4087 阅读 · 0 评论 -
微信小程序 设置cookie-保持会话持久-免登录
设置cookie是比较常见的配置，cookie持久化以保证免登录，算了算了不扯这么多。。最简单粗暴的解决方式1.在app.js中定义一个全局变量 cookie: "",2.请求接口，比如登录，后台在请求头中获取jsessionIdString sessionId=request.getsession().getid()然后返回给前台3.前台在请求...原创 2018-07-31 17:53:45 · 18620 阅读 · 3 评论 -
微信小程序 保留两位小数
1，新建一个wxs文件var numberUtil = { numberFormat: function (value) { var v = parseInt(value)//强转Int，毕竟有可能返回是String类型的数字 return v.toFixed(2) }}module.exports = { ...原创 2018-07-31 18:09:28 · 15537 阅读 · 1 评论 -
小程序 如何获取picker普通选择器的值，而不是下标
wxml<picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}"> <button type="default">单列选择器---{{array[index]}}</button> </picker>{{ar原创 2018-07-27 18:48:21 · 9435 阅读 · 3 评论 -
微信小程序 列表渲染多层嵌套循环
前言入门教程之列表渲染多层嵌套循环，目前官方的文档里，主要是一维数组列表渲染的案例，还是比较简单单一，给刚入门的童鞋还是无从入手的感觉。<view wx:for="{{items}}"> {{index}}: {{item.message}}</view>还有一个九九乘法表把数据直接写到wxml里的，并不是动态二维数组的列表渲染。<vie...转载 2018-08-09 15:25:01 · 26717 阅读 · 0 评论 -
微信小程序 给数字或文字加横线，比如原价、已完成任务
比如电商中的给原价加横线 <view style='font-size:14px;'> 原价： <text style='color:#FF6F10;text-decoration:line-through;'> 9.00 </text> </view>核心属性 text-decoration:lin...原创 2018-08-09 15:43:49 · 22203 阅读 · 0 评论 -
微信小程序 去掉滚动条
方案一：::-webkit-scrollbar { width: 0; height: 0; color: transparent;}方案二：::-webkit-scrollbar { display: none;} 其实也没有完全去掉，只是把粗粗的滚动条变细了而已，不过其他小程序也都是这样的…...原创 2018-08-07 11:59:49 · 7066 阅读 · 3 评论 -
微信小程序 修改键盘的回车键及监听事件
在input标签中有一个confirm-type 属性，即设置键盘右下角按钮的文字，仅在type=’text’时生效示例：<input type="text" placeholder="搜索" confirm-type="search"/>confirm-type 有效值：send 右下角按钮为“发送”search 右下角按钮为“搜索”next ...原创 2018-08-07 12:07:59 · 10608 阅读 · 2 评论 -
微信小程序 textarea 统计输入长度
wxml &lt;view class="weui-cells weui-cells_after-title"&gt; &lt;view class="weui-cell"&gt; &lt;view class="weui-cell__bd"&原创 2018-08-03 11:41:45 · 5254 阅读 · 0 评论 -
【开源项目】小程序版 玩安卓
????wanandroid_mini【小程序版 玩安卓】感谢鸿洋提供的api玩安卓 Flutter版本玩安卓 Java版本玩安卓 小程序版本老铁，点个star????github：https://github.com/yechaoa/wanandroid_mini????截图首页体系导航项目????你能学到轻松上手小程序系列网络框架的封装定时器的使用页...原创 2019-09-27 20:14:47 · 1069 阅读 · 0 评论