评论

image组件自适应高度解决方案

解决image宽高自适应展示问题

imageload(e){
      // console.log("widthwidth",e.detail)
      var { height, width } = e.detail;
      // console.log("width/height",width/height)
      if(height>=width){
        if(height/width>2){
          this.setData({
            imageMode:"aspectFill",
            imgHeight : 360,
            imgWidth : 180,
          })
          return
        }else if(height/width>1.3){
          this.setData({
            imageMode:"heightFix",
            imgHeight : 350
          })
        }else{
          this.setData({
            imageMode:"heightFix",
            imgHeight : 320
          })
        }
        
      }else{
        var ratio=width/height
        if(ratio>2){
          this.setData({
            imageMode:"aspectFill",
            imgHeight : 250,
            imgWidth : 500,
          })
        }else if(ratio>1.3){
          this.setData({
            imageMode:"widthFix",
            imgWidth : 400
          })
        }else{
          this.setData({
            imageMode:"widthFix",
            imgWidth : 350
          })
        }
      }
    },
最后一次编辑于  06-03  
点赞 0
收藏
评论

4 个评论

  • 神经蛙
    神经蛙
    11-29

    base64图片也可以吗

    11-29
    赞同
    回复
  • 林俊宇
    林俊宇
    06-03

    很不错啊,加油

    06-03
    赞同
    回复 1
    • Arosy
      Arosy
      06-03
      谢大佬
      06-03
      回复
  • dreamhunter
    dreamhunter
    06-03

    一般需求,图片在页面显示尺寸都是固定的

    06-03
    赞同
    回复 1
    • Arosy
      Arosy
      06-03
      对于论坛帖子一类的就不能用固定的了
      06-03
      回复
  • Arosy
    Arosy
    06-03

    大家有更好的解决方案可以交流一下

    06-03
    赞同
    回复
登录 后发表内容