授权
授权是最基本的需求,官方获取用户信息接口调整
使用 button 组件,并将 open-type 指定为 getUserInfo 类型,获取用户基本信息
html:
<button open-type="getUserInfo">授权</button>
这样效果是获得一个授权的弹窗,但是和之前的是大不一样
js:
wx.getUserInfo({
success: (res) => {
console.log("成功",res);
},
fail:res=>{
console.log("失败",res)
}
});
效果
至于 wx.authorize,我是这样写的,致死也没有触发
if (res.authSetting["scope.userInfo"] == undefined) {
wx.authorize({
scope: "scope.userInfo",
success: (res) => {
console.log("首次授权成功", res);
},
fail:res=>{
console.log("首次授权失败",res)
}
});
}
啊不对,是致死也没有成功触发,失败是这样
至于为什么写 ==undefined,是因为在一次都没有授权的情况下是这样的,很干净,此时是 undefined
而授权过但是后来关闭了是这样的,这时是有授权信息的,只是关闭了,此时是 false
授权这方面除了用 button,也可以使用 wx.openSetting(),打开小程序授权页面,让用户自行打开授权信息,我这里是这样写的,但是出 bug 了,不会打开还授权失败,这里就没图了。。。
wx.openSetting({
success: (res) => {
console.log("授权成功");
},
fail: (res) => {
console.log("授权失败");
},
});
动画
和 H5 有点差距
第一种:官方文档
wxml:
直接在元素上加上 animation="{{动画名}}"
例如
<view animation="{{GoTop}}"></view>
js:
data:{
GoTop:“”
}
this.GoTop = wx.createAnimation({ //创建动画
duration: 1000, //动画持续时长
}).translateY(-1000).step() //动画
this.setData({
GoTop: this.GoTop.export()
})
第二种:官方文档
获取当天日期
var util = require("../../utils/utils");
var TIME = util.formatTime(new Date());
console.log(TIME)
绑定的事件带有传递参数
wxml:
<view bindtap="test" data-name="{{666}}">点击</view>
js:
test:function(event){
console.log(event)
}
输出结果里有currentTarget里有dataset里有name:"666"可使用
当然也可以传递动态参数
wxml:
<view bindtap="test" data-name="{{arr}}">点击</view>
js:
data:{
arr=[1,2,3,4,5,6]
}
test:function(event){
console.log(event)
}
输出结果里有currentTarget里有dataset里有name:[1,2,3,4,5,6]可使用
按钮功能阻止冒泡
wxml:
<button catchtap="click1"></button>
catch 用来阻止冒泡,bind不可阻止冒泡
使用动画 更多属性看官网
wxml:
<view animation=" animation">
js:
data:{
animation:""
}
this.animation = wx.createAnimation({
duration: 1000,//持续时间
delay:100//延时
}).translate(100).step()
获取元素信息
js:
wx.createSelectorQuery().select(".||#||标签").boundingClientRect(res =>
console.log(res)
).exec();
Written ❤️ sywdebug.