| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657 |
- <template>
- <view class="content">
- <view class="main">
- <view class="main-item" v-for="(item,index) in list">
- <image :src="item" mode=""></image>
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- list: ['../../static/img/avatar.png', '../../static/img/avatar.png', '../../static/img/avatar.png',
- '../../static/img/avatar.png', '../../static/img/avatar.png', '../../static/img/avatar.png',
- '../../static/img/avatar.png', '../../static/img/avatar.png', '../../static/img/avatar.png'
- ]
- };
- },
- onLoad() {},
- onShow() {},
- onReachBottom() {},
- onReady() {},
- methods: {}
- };
- </script>
- <style lang="scss">
- page,
- .content {
- min-height: 100%;
- height: auto;
- }
- .main {
- margin-top: 20rpx;
- background: #ffffff;
- display: flex;
- align-items: center;
- flex-wrap: wrap;
- padding: 20rpx 10rpx;
- .main-item {
- margin: 20rpx 10rpx;
- width: 334rpx;
- height: 334rpx;
- border-radius: 14rpx;
- image {
- width: 100%;
- height: 100%;
- border-radius: 14rpx;
- }
- }
- }
- </style>
|