<template>
<view class="body">
<view class="item" v-for="(item, index) in list" :key="index">
<text class="text">{{ item.title }}</text>
</view>
</view>
</template>
<script>
export default {
name: 'test',
data() {
return {
list: [
{title: '测试比尔发地方', content: '2222'},
{title: '发地方', content: '2222'},
{title: '测试比尔发地方', content: '2222'},
{title: '测试比地方', content: '2222'},
{title: '测试比发地方', content: '2222'},
{title: '测试比发地方', content: '2222'},
]
}
}
}
</script>
<style scoped lang="scss">
.body {
width: 100%;
height: 100vh;
.item {
width: 100rpx;
height: 100rpx;
background-color: #f00;
display: flex;
align-items: center;
justify-content: center;
padding: 10rpx;
box-sizing: border-box;
.text {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
text-align: center;
font-size: 24rpx;
line-height: 1.2;
color: #fff;
}
}
}
</style>
