遇到的问题：
小程序不支持长按识别二维码
小程序不支持长按识别二维码，所以遇到产品要求要做成小程序页面但是需要长按识别二维码的场景需要注意下。
解决方式：
- h5方案：改成小程序嵌h5方案，将需要长按识别二维码的页面做成h5页面，h5中可长按识别二维码
- 小程序方案：使用小程序接口
wx.previewImage点击图片进行预览，图片预览后可以长按识别二维码
小程序web-view可打开小程序关联公众号文章
小程序web-view中可以打开小程序关联的公众号的文章，但不能是短链形式打开的文章，需要是 https://mp.weixin.qq.com/ 开头的链接
一些会跳转到发布版本小程序的场景
- 小程序URL link打开跳转的是已发布的小程序（只能生成已发布的小程序的 URL Link）
- 从消息订阅模板点击跳转小程序页面，为已发布小程序页面
css
- 设置input的disabled、placeholder颜色
input[disabled]{
background: unset;
color: #6b6b6b;
-webkit-opacity: 1;
opacity: 1;
-webkit-text-fill-color: #6b6b6b;
}
input[disabled] .placeholder-class{
color: #C8C8C8;
-webkit-text-fill-color: #C8C8C8;
}
.placeholder-class{
color: #C8C8C8 !important;
}
// wxml
<input
v-model="form.name"
placeholder="请输入您的姓名"
placeholder-class="placeholder-class"
:disabled="isDisabledInput"
>
</input>
本地资源无法通过 WXSS 获取，
background-image：可以使用网络图片，或者 base64，或者使用image标签能使用
calc:height: calc(100% - 100rpx);官方组件的样式可以通过
!important覆盖-
button组件默认都加了一个border，该button控件上有一个伪元素（::after），设置了border，只要把button::after 的border 属性去掉就可以了，
/*去掉按钮边框*/ button::after { border: 0; } /*去掉button默认样式*/ button { border-radius: 0; background-color: transparent; padding: 0; margin: 0; } -
修改radio框的样式:先把radio组件隐藏起来，自己写自定义样式和选中样式，再在data中设置一个选中的变量，来显示是否显示选中样式
<radio-group class="radioGroup" bindchange="radioChange"> <label class="radio" wx:for="{{items}}" wx:key="id"> <!-- 自定义的radio样式 --> <view class='radioPoint'> <view class='radioDefault'> <view class="{{radioCheckVal==item.id?'radioActive':''}}"></view> </view> </view> <view class='radioText'> {{item.value}}</view> <!-- 隐藏默认的radio样式 --> <radio value="{{item.id}}" hidden="true" checked="{{item.checked}}" /> </label> </radio-group>Page({ /* 页面的初始数据 */ data: { items: [ { id: 1, value: '选项1' }, { id: 2, value: '选项2' }, ], radioCheckVal: null }, radioChange: function (e) { this.setData({ radioCheckVal: e.detail.value }) }, }) 在微信小程序内的文字无法长按复制，除了text节点以外。但要在text标签内加一个“selectable”属性。
<text selectable='true' ><text/>
js
-
setData 函数用于将数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）。
- 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的，还会造成数据不一致。
- 单次设置的数据不能超过1024kB，请尽量避免一次设置过多的数据。
- 请不要把 data 中任何一项的 value 设为 undefined ，否则这一项将不被设置并可能遗留一些潜在问题。
小程序里面的打开的页面，请求需要是https协议，websocket协议需要是wss协议
按小程序右上角退出小程序和按home键退出微信，小程序里面的ws连接都不会断
-
小程序通过按钮点击分享，无法做到先发起网络请求获取某些信息再进行分享的功能，因为onShareAppMessage方法必须要return一个对象，不能放在wx.request回调里面return，必须事先获取。
//分享到个人/群判断方法 Page({ onShareAppMessage: function () { //设置withShareTicket: true才能获取shareTickets信息 wx.showShareMenu({ withShareTicket: true }) return { title: '分享标题', path: '/pages/index/index', imageUrl: '', success: (res) => { // 转发成功 if (res.hasOwnProperty('shareTickets')) { // 转发到群 wx.getShareInfo({ shareTicket: res.shareTickets[0], success: (res) => { //encryptedData,iv发送给后台解密，获取到openGId }, fail: function (res) { console.log('获取微信分享信息失败') } }) } else { // 转发到个人 } }, fail: function (res) { // 转发失败 } } }, }) -
隐藏小程序导航栏方法，在app.json中配置navigationStyle：
{ "pages": [], "window": { "navigationStyle": "custom" } } 微信sdk分享的链接中不能含有中文字符，否则不能自定义分享，一定要把分享的链接encode一下
处理退出小程序的操作：目前没有提供这样的接口，但是可以用wx.navigateBack()做处理，将跳转层级设为最大跳转数量即可。
wx.navigateBack({delta:20})涉及到经常切换的需要用
hidden来实现样式切换，不要用wx:if，用这个切换的时候会导致闪烁问题自定义组件里面的wxss不会影响到页面的样式，所以不能继承自定义组件里面的样式
-
获取dataset:获取最外层dataset通过
event.currentTarget.dataset就可以获取，里面的子元素就不用写上data-，而不用event.target.dataset获取<view class="btn" bindtap="tapNav" data-nav="1"> </view> <view class="btn" bindtap="tapNav" data-nav="1"> <view data-nav="2"></view> </view> // 读取当前执行事件的view data-nav值打印出来 // 第一个打出1 // 第二个如果点击的位置是子view的话，会打印出2. tapNav:function(event){ console.log(event.target.dataset.nav) //2 console.log(event.currentTarget.dataset.nav) //1 }, 生命周期执行顺序：
onLoad->onShow->onReady授权和登录是两回事。登录是用户无感知的，获取到
code和后端通信获得openid来定位用户。而授权才能获取用户头像和名字等信息-
在不授权的情况下，可以通过open-data获取用户基本信息，在微信
6.6.1版本中获取不了，并且基础库1.9.90版本才开始支持，遇到需要显示用户信息的地方还是需要手动授权，不能依赖于open-data。<button open-type="getUserInfo" bindgetuserinfo="getUserInfo"></button> 无论是
bindscrolltoupper还是bindscrolltoupper做上拉下拉刷新都需要注意这两个事件是会多次调用的。需要一个标识符来拦截多次调用。下拉刷新建议用 page 的this.setData()修改数据是异步的，因此不能用它来做上下拉刷新的标识符页面路径只能是五层，请尽量避免多层级的交互方式。
-
路由传递参数bug: 比较长的字符串作为参数应该放在最后。
const TestUserData = { header: "https://pic.qiushibaike.com/system/avtnew/3422/34228569/thumb/20170914201113.JPEG?imageView2/1/w/90/h/90", name: "哈哈哈哈", text: "红鲤鱼和绿鲤鱼与驴", } // 跳转之后只能读取到header wx.navigateTo({ url: `../result/result?header=${TestUserData.header}&name=${TestUserData.name}&text=${TestUserData.text}`, }) // 跳转之后三个参数都能读取 wx.navigateTo({ url: `../result/result?name=${TestUserData.name}&text=${TestUserData.text}&header=${TestUserData.header}`, }) 授权弹窗如果用户很久不响应的话，就会调用失败
transform: translate(0,100rpx);一个绝对定位的布局会撑开page节点路由跳转bug:经过测试，因为页面跳转是有动画时效的，在动画进行中当前页面还能操作。如果双击当前跳转按钮机会进行两次跳转。第二次点击的时候小程序内置的路由栈是已经定位到了新的页面了，而这时候在按照原来的路由栈去定位当前页面，因此会报错。所以页面跳转按钮需要进行短时间多次点击的限制
素材
- 素材引入使用相对路径
- 支持
image内src放置svg。但是不支持直接在wxml里面直接使用svg - 录音音频，旧版的是
silk格式,和公众号开发的时候一致。而新版可以自己选择aac
