代码:
<template>
<view style="display:flex;">
<scroll-view :scroll-y="true" style="width: 100%;height: 500px;">
<uni-collapse>
<uni-collapse-item title="数字">
<uni-grid :column="3" :showBorder="false" style="height: 100%;">
<uni-grid-item v-for="(item, index) in data" :key="index">
<view style="display: flex;align-items:center;justify-content: center;height: 200rpx;">
<image style="width: 80%; height: 80%;border-radius: 10rpx;" :src="item"></image>
</view>
</uni-grid-item>
</uni-grid>
</uni-collapse-item>
</uni-collapse>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
data: ['/static/c1.png', '/static/c2.png', '/static/c3.png', '/static/c4.png', '/static/c5.png', '/static/c6.png', '/static/c7.png', '/static/c8.png', '/static/c9.png']
};
},
methods: {}
};
</script>
<style></style>
H5截图
app运行截图
023se (作者)
谢谢,的确样式不对,不知道为什么高度和宽度都没了,也不知道为什么H5和app中不一样,为每个元素赋上宽高就正常了。
2022-06-18 15:50