微信小程序swiper组件卡顿
出现的机型：魅族魅蓝note5，安卓无法识别全面屏--微信小程序开发。魅族pro7。


index.html












经度：{{latitude}}
纬度：{{longitude}}

扫一扫


index.js

//index.js
//获取应用实例
const app = getApp()

Page({
data: {
motto: 'Hello World',
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo'),
latitude: 0,
longitude: 0,
imgUrls: [
{ src: 'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg', index: 0 },
{ src: 'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg', index: 1 },
{ src: 'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg', index: 2 }
],
indicatorDots: true,
autoplay: false,
interval: 4000,
duration: 300
},
//事件处理函数
bindViewTap: function () {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad: function () {
var that = this;
wx.getLocation({
type: 'wgs84',
altitude: true,
success: function (res) {
var latitude = res.latitude // 经度
var longitude = res.longitude // 纬度
that.setData({
latitude: latitude,
longitude: longitude
})
},
fail: function (res) { },
complete: function (res) { },
})
if (app.globalData.userInfo) {
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse) {
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
}
},
getUserInfo: function (e) {
console.log(e)
app.globalData.userInfo = e.detail.userInfo
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
},
/*扫一扫 */
scan: function () {
wx.scanCode({
success: (res) => {
console.log(res)
}
})
},
/**转发 */
onShareAppMessage: function (res) {
if (res.from === 'button') {
// 来自页面内转发按钮
console.log(res.target)
}
return {
title: 'Wendy的微信小程序',
success: function (res) {
// 转发成功
},
fail: function (res) {
// 转发失败
}
}
}
})

index.wxss

/**index.wxss**/
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
}

.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
}

.userinfo-nickname {
color: #aaa;
}

.usermotto {
margin-top: 200px;
}
swiper{
width: 100%;
height: 420rpx;
}
swiper navigator{
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}