收藏
评论

view里放多个元素横向排列自动换行

.js文件

data: {

    msg: [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], // 只是占位

},


.wxml文件

<view class="view">

    <block wx:for="{{msg}}" wx:key="" wx:for-item="">

        <view class='item'>{{index}}</view>

    </block>

</view>


.wxss文件

.view {

width: 100%;

height: 500rpx;

display: flex;

flex-wrap: wrap;

align-content: flex-start;

}

.item {

width: 50rpx;

height: 50rpx;

margin: 10rpx;

background-color: greenyellow;

text-align: center;

}

PS:本文只是记录个人学到的东西,以免还要到处搜索。希望对读者有帮助~

收藏

2 个评论

  • 2019-02-18

    也可以用grid组件

    2019-02-18
    赞同
    回复
  • 2019-01-28

    如果msg是动态变化的,最好在wx:key=""里面加上*this或者其他属性







    /个性签名,不服不行;突破1万小时,你就是高手!😄


    2019-01-28
    赞同
    回复
登录 后发表内容