编辑如下,出现竖向滚动
<view class=‘section’>
<view class=‘section_title’>test</view>
<scroll-view scroll-x=‘ture’>
<block wx:for=’{{homeurls}}’ wx:key=’{{item}}’>
<image class=‘section_image’ src=’{{item.pic}}’></image>
<view class=‘section_text’ src=’{{item.title}}’>{{item.title}}</view>
</block>
</scroll-view>
</view>
.scroll_father {
min-width: 50px;
white-space: nowrap;
}
.scroll_children {
width: 100px;
min-height: 80px;
display: inline-block;
}
xss:
.section{
height: 300px;
width: 100%;
}
.section_title{
width: 100%;
height: 60rpx;
font-weight: bold;
font-size: 20px;
color: grey;
display: flex;
align-items: center;
justify-content: center;
}
.section_image{
height: 90px;
width: 33.333%;
}
.section_text{
height: 15px;
width: 100%;
font-size: 13px;
text-align: center;
}
.js
homeurls:[
{pic:‘http://www.000/File/DS0418(3).jpg’,
title:‘000’,
},
{pic:‘http://www.000/File/DS1378.jpg’,
title:‘000’
},
{pic:‘http://www.000/File/DS0362.jpg’,
title:‘000’,
},
{pic:‘http://www.000/File/DS2843.jpg’,
title:‘000’,
},
{pic:‘http://www.000/File/DS2886(2).jpg’,
title:‘000’,
},
{pic:‘http://www.000/File/DS2795(1).jpg’,
title:‘000’
}
],