收藏
回答

开发工具中无法识别image标签的mode="aspectFill"属性

问题模块
API和组件

开发工具是1.01.170907版本,为image标签添加的mode="aspectFill"属性无法生效。扫描预览二维码后,在手机上显示正常。

最后一次编辑于  2017-09-12  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

4 个回答

  • HS
    HS
    2017-09-12

    没有复现此问题,请问是否有示例代码?

    2017-09-12
    赞同
    回复
  • 张博 Bill
    张博 Bill
    2017-09-14
    <view class="images_container">
        <block wx:for="{{photos}}">
          <image
                mode="aspectFill"
                data-idx="{{index}}"
                bindtap="imageViewClicked"
                class="{{(index % 5 == 0 || index % 5 == 1)?'image_col_2':'image_col_3'}}"
                src="{{item.preview_url}}">
         </image>
        </block>
      </view>


    .images_container {
      margin-top: 80rpx;
      width: 710rpx;
      display: flex;
      flex-flow: row;
      justify-content: flex-start;
      align-content: flex-start;
      flex-wrap: wrap;
      position: relative;
      left: 3rpx;
    }
     
    .image_col_2 {
      height: 442rpx;
      width: 349rpx;
      margin-right: 6rpx;
      margin-bottom: 6rpx;
    }
     
    .image_col_3 {
      height: 290rpx;
      width: 230rpx;
      margin-right: 6rpx;
      margin-bottom: 6rpx;
    }


    代码里有段特殊的判断,是想让奇数行的照片显示3张,偶数行的照片显示两张。


    目的实现下图的效果:



    该图为设计图,并非截图!!!

    该图为设计图,并非截图!!!

    该图为设计图,并非截图!!!

    2017-09-14
    赞同
    回复
  • HS
    HS
    2017-09-14

    现在不是 aspectFill 的效果吗?

    2017-09-14
    赞同
    回复
  • 张博 Bill
    张博 Bill
    2017-09-15

    我贴的图是设计图。


    由于我们的功能正在开发中,那个页面现在展示不出来了,稍等一段时间,我再来贴截图

    2017-09-15
    赞同
    回复