小程序图片自适应

参考

1.小程序图片自适应 wxml

2.书写js

data: {
    vwidth:null,
  },
imageLoad: function (e) {
    var $width = e.detail.width,    //获取图片真实宽度
      $height = e.detail.height,
      ratio = $width / $height;    //图片的真实宽高比例
      console.log("图片宽高比："+ ratio);

    // 获取图片容器宽度
    //创建节点选择器
    var query = wx.createSelectorQuery();
    var that = this;
    query.select('.img-box').boundingClientRect(function (rect) {
      console.log(rect.width)
      // 设置图片的宽高
      that.setData({
          vwidth:rect.width
      })
    }).exec();

  }