background-image支持网络的图片链接或者base64
UI设计模版要按750宽出图
样式，属性或者内容都支持{{双大括号输出
swiper, scroll-view,picker,switch,slider,open-data等等组件。wx.request,wx.setStorage,wx.getSystemInfo,wx.onNetworkStatusChange,wx.makePhoneCall,wx.setClipboardData,wx.getClipboardData,wx.chooseImage,wx.saveFile,wx.downloadFile,wx.openDocument,wx.getFileInfo等等API
tap,touchstart,touchmove,touchcancel,touchend,longpress,longtap等等
globalData = {
userInfo: null,
fetch: fetch, // 把fetch绑到全局使用
API: API, // 把API绑到全局使用
Base64: new Base64(), // 把Base64绑到全局使用
isLoading: true
}
异步调用如setTimeout或者request请求后
这跟mina框架使用方式不一样，与vue也不一样
如可用开发工具的1.9.9调试库来测试，可能会出现如下问题：
1、不显示头像问题
<open-data type="userAvatarUrl" ></open-data>
可用设置背景为默认头像解决
2、连续多次点击触发多次navigateTo或者toast事件，解决方式是绑定变量立flag防止多次触发
与vue的$nextTick类似，视图更新后触发回调
可用onShow, onHide, onLoad, onUnload等处理，或者根据场景值有 1001, 1019, 1022, 1023, 1038, 1056进行相应的处理
其运行机制可参考：https://developers.weixin.qq.com/miniprogram/dev/framework/operating-mechanism.html
onShareAppMessage: (res) => {
if (res.from === 'button') {
console.log("来自页面内转发按钮");
console.log(res.target);
}
else {
console.log("来自右上角转发菜单")
}
return {
title: '标题',
path: '/pages/index',
imageUrl: "/images/1.jpg"
}
}
通常开发者希望转发出去的小程序被二次打开的时候能够获取到一些信息，例如群的标识。现在通过调用 wx.showShareMenu 并且设置 withShareTicket 为 true ，当用户将小程序转发到任一群聊之后，此转发卡片在群聊中被其他用户打开时，可以在 App.onLaunch() 或 App.onShow 获取到一个 shareTicket。通过调用 wx.getShareInfo() 接口传入此 shareTicket 可以获取到转发信息。
可使用通用的CSS3 keyframe动画
constructor() { // 1、通过接口拦截了解网络情况
super()
this.use('requestfix')
// this.use('promisify')
// 拦截request请求
this.intercept('request', {
// 发出请求时的回调函数
config (p) {
// 对所有request请求中的OBJECT参数对象统一附加时间戳属性
// p.timestamp = +new Date();
// console.log('config request: ', p)
// 必须返回OBJECT参数对象，否则无法发送请求到服务端
return p
},
// 请求成功后的回调函数
success (p) {
// 可以在这里对收到的响应数据对象进行加工处理
// console.log('request success: ', p)
// 必须返回响应数据对象，否则后续无法对响应数据进行处理
return p
},
//请求失败后的回调函数
fail (p) {
// console.log('request fail: ', p)
// 必须返回响应数据对象，否则后续无法对响应数据进行处理
return p
},
// 请求完成时的回调函数(请求成功或失败都会被执行)
complete (p) {
// console.log('request complete: ', p)
}
});
}
wx.getNetworkType({ // 2、通过网络类型
success: function(res) {
// 返回网络类型, 有效值：
// wifi/2g/3g/4g/unknown(Android下不常见的网络类型)/none(无网络)
var networkType = res.networkType
}
})
wx.onNetworkStatusChange(function(res) { // 3、监听网络变化
console.log(res.isConnected)
console.log(res.networkType)
})
获得opened的方式详见：https://developers.weixin.qq.com/miniprogram/dev/api/api-login.html#wxloginobject
1、project.config.json
{
"description": "project description",
"setting": {
"urlCheck": true,
"es6": false,
"postcss": false,
"minified": false
},
"compileType": "miniprogram",
"appid": "touristappid",
"projectname": "Project name",
"miniprogramRoot": "./dist"
}
es6: 对应关闭ES6转ES5选项，关闭。 重要：未关闭会运行报错。
postcss: 对应关闭上传代码时样式自动补全选项，关闭。 重要：某些情况下漏掉此项也会运行报错。但上传代码时要打开，不然会有机型不适配问题
minified: 对应关闭代码压缩上传选项，关闭。重要：开启后，会导致真机computed, props.sync 等等属性失效。（注：压缩功能可使用WePY提供的build指令代替，详见后文相关介绍以及Demo项目根目录中的wepy.config.js和package.json文件。）
urlCheck: 对应不检查安全域名选项，开启。 如果已配置好安全域名则建议关闭。
2、可灵活切换 调试基础库 进行兼容性测试
类似window.history的机制
注意：调用 navigateTo 跳转时，调用该方法的页面会被加入堆栈，而 redirectTo 方法则不会。目前页面路径最多只能十层。
globalData = { // wepy开发中在app.wpy文件中全局定义好分享内容
shareInfo: {
title: '我的标题',
path: '/pages/index',
imageUrl: '../images/share.jpg' // 图片比例5:4，如500*400，尽量控制图片的大小，不然会被微信强制压缩影响图片质量
}
}
// 分享方案设置
onShareAppMessage (res) {
const shareInfo = this.$parent.globalData.shareInfo // 全局设置分享内容
return {
title: shareInfo.title,
path: shareInfo.path,
imageUrl: shareInfo.imageUrl // 图片比例5:4，如500*400，尽量控制图片的大小，不然会被微信强制压缩影响图片质量
}
}
方案一、弹出层时给根元素添加 height: 100%; overflow: hidden; 样式
方案二、弱解决，不打包票的方案：catchtouchmove="preventTouchMove"，给弹层添加阻止touchmove冒泡，如果是wepy下则写成@touchmove.stop="preventTouchMove"，preventTouchMove是自定义的空函数
wx.onNetworkStatusChange(function(res) {
console.log(res.isConnected) // 网络连后如何处理，需不需要重新登录wx.login
console.log(res.networkType) // 输出网络类型 wifi/2g/3g/4g/unknown(Android下不常见的网络类型)/none(无网络)
})
wx.getNetworkType({
success: function(res) {
// 返回网络类型, 有效值：
// wifi/2g/3g/4g/unknown(Android下不常见的网络类型)/none(无网络)
var networkType = res.networkType
}
})
1、使用wx:if
2、设置hidden="true"
3、设置样式opacity
4、如果是文字，可以设置font-size为0再恢复
一般审核时间的长短是与小程序的类别有关的，如社交类的需进行互联网主管部门的二次审核，需要一到两周的时间才能完成审核。其他工具类的可能2~3天就可以一次审核通过。
https://github.com/Tencent/wepy/wiki/WePY-%E4%BD%BF%E7%94%A8less-autoprefix
给图片链接加随时时间戳参数，或者更换图片名字
`${url}?t=${String(new Date().valueOf())}`
可通过wx.getSystemInfo(Object object)获得高度后计算出高度动态设置
brand string 手机品牌 >= 1.5.0 model string 手机型号 pixelRatio number 设备像素比 screenWidth number 屏幕宽度 >= 1.1.0 screenHeight number 屏幕高度 >= 1.1.0 windowWidth number 可使用窗口宽度 windowHeight number 可使用窗口高度 statusBarHeight number 状态栏的高度 >= 1.9.0 language string 微信设置的语言 version string 微信版本号 system string 操作系统版本 platform string 客户端平台 fontSizeSetting number 用户字体大小设置。以“我-设置-通用-字体大小”中的设置为准，单位 px。 >= 1.5.0 SDKVersion string 客户端基础库版本 >= 1.1.0 benchmarkLevel number (仅Android小游戏) 性能等级，-2 或 0：该设备无法运行小游戏，-1：性能未知，>=1 设备性能值，该值越高，设备性能越好 (目前设备最高不到50) >= 1.8.0
调用wx.login(Object object)获取的登录凭证（code）（有效期五分钟）。开发者需要在开发者服务器后台调用 code2Session，使用 code 换取 openid 和 session_key 等信息，与用户的openid匹配则为真人行为，不相等或者接口调用失败则为非法请求
如果特殊情况如同时点击提交按钮，则可通过setTimeout来处理，因为onblur取到的值会有一定的延时。
当需要做一个类似dialog的组件时，要控制组件显示与隐藏，要给组件定义好一个show与hide方式即可，然后在调用组件的页面调用该组件即可对组件进行显示与隐藏的控制。代码如下：
定义组件：
<style lang="less">
</style>
<template>
<view class="my-dlg" wx:if="{{show}}">
</view>
</template>
<script>
import wepy from 'wepy'
export default class MyDlg extends wepy.component {
props = {
}
data = {
show: false
}
events = {
}
methods = {
showDlg () {
this.show = true
},
closeDlg () {
this.show = false
}
}
onLoad () {
}
}
</script>
调用组件
// 先把myDlg组件import到页面中，定义好，然后可以这样控制组件
this.$invoke('myDlg', 'showDlg')
小程序中想使用图片背景一般需要先把图片转成base64码，或者使用网络网络路径，不能使用本地相对路径。
支付宝小程序做页面切图布局方式还非常原始 - view + css（类似传统的div+css），没有像开发微信小程序那么多框架（如wepy、mpvue等）支持。但幸好社区出现修改版的wxss-cl工具使得我们可以使用less来进行样式预处理。详细如下：
https://openclub.alipay.com/read.php?tid=12098&fid=66&ant_source=zsearch
比如把标签view写错成veiw可能会现现什么异常呢？如果页面节点结构复杂的话开发者工具的渲染器会卡死，如果节点简单的话，可以错误的渲染出来；这两种情况调试器都不会报错，要切换到 调试小程序开发者工具 (ctr+shift+I ) 才可以看到下面这样的报错。
C:\Program Files\小程序开发者工具\resources\app\out\volans\workbench\browser\code\index.js:1 [renderer.file][Wed Jan 02 2019 11:35:03 GMT+0800 (中国标准时间)][ERROR]d:\xxx\index.axmlrecognized as binary
| 1 2 3 |
<my-component :onOk="onMyComponentOk"/> |
| 1 2 3 4 |
onMyComponentOk () { console.log(this) // 输出组件对象 console.log(this.$parent) // 输出当前组件的上面的调用方对象} |
作者也表态了，在一开始的设计中，mixin就不支持on事件，建议使用类的继承去实现
| 1 2 3 |
export MyPage extends wepy.page {}export Index extends MyPage {} |
https://github.com/Tencent/wepy/issues/824
可以直接使用wxs实现类似功能，或者直接使用页面上自定义的函数
https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/
wx.showToast()与wx.hideLoading()同时调用时，wx.showToast在手机上没效果，原因应该是hideLoading不仅会作用于loading还作用于toast．
解决方案：wx.showToast()与wx.hideLoading()不同时调用，使用setTimeout延时调用wx.showToast()
小程序在支持上传图片时比较友好，但要传其他文件时，并没有提供相关的支持，目前可想到的方案是拉出web-view来使用h5实现上传文件的功能，但此方案的缺陷是ios根本选择不了文件，因此只能支持安卓端。比较鸡肋。
