qq_43501326
qq_43501326
采纳率0%
2021-01-25 21:32 阅读 4

文本无法显示省略号,还把布局打乱了。请问大佬怎么回事

子组件:
<template>
   <div class="goods-info">
        <div class="goods-image">
            <img v-lazy="mall.image" width="90%" />
        </div>
        <div class="name1">{{mall.name}}</div>
        <div class="goods-price">¥{{mall.price}}</div>
    </div>
</template>

<script>
    export default {
        data(){
            return{

            }
        },
        props:{
            mall:{
                type:Object,
                required:true
            }
        }
    }
</script>

<style lang="less" scoped>
.name1{
    padding: 0 8px;
       overflow: hidden;
       text-overflow: ellipsis;
       white-space:nowrap; 
}
</style>
父组件:
<div class="hot-goods">
            <!--这里需要一个list组件,gutter指空隙,20px-->
            <van-list>
                <van-row gutter="20">
                    <van-col span="12" v-for="(item,index) in hotlist" :key="index"> 
                        <hotmall :mall="item"></hotmall>
                    </van-col>
                </van-row>
            </van-list>
          </div>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享

1条回答 默认 最新

  • csdn_chengpeng 程鹏; 2021-01-27 10:42

    给.name1指定一个width

    点赞 评论 复制链接分享

相关推荐