小程序进入页面图片渲染会拉伸闪下变形优化.md

有些从接口传递过来的图片，本身图樱缺歼片大小不是固定一个比例，全部渲染显示在页脊冲面上，会有唰得扮链拉伸从大到小快速闪下变形的bug，很影响用户体验。

image的mode图片剪裁缩放模式用 mode='widthFix' (宽度不变，高度自动变化，保持原图宽高比不变)，记得要在css里也加上height:auto，可以消除渲染拉伸变形一闪而过的bug。

image 的mode有13种模式，4种是缩放模式，9种是剪裁模式。

设计将背景切成了三段，左边、中间、右边

重新设置width解决问题

const query = wx.createSelectorQuery().in(that)

query.select('.nick-center-content').boundingClientRect(function (res) {

console.log(res)

that.setData({

nickWidth: parseInt(res.width)

})

// res.width

}).exec()

欢渗物伍迎蚂老体验作丛或者开发的小程序

cropper组和槐团件唤橘明岩

cropper.js

cropper.json

cropper.wxml

cropper.wxcc

index.js

index.json

index.wxml

index.wxss

log.js

log.json

log.wxml

log.wxss

app.json

---