vue配合elementUI实现文本超出宽度，显示省略号并且鼠标移入显示全部内容_elementui input 鼠标移动显示文字

作者：花生_TL007 | 2024-02-16 07:10:51

踩

elementui input 鼠标移动显示文字


<el-popover trigger="hover" placement="top" width="200">
    <p>{{ text }}</p>
    <div slot="reference" class="textBox">
        {{ text }}
    </div>
</el-popover>


data(){
    return {
        text: "猫，属于猫科动物，是全世界家庭中较为广泛的宠物。家猫的祖先据推测是古埃及时期的沙漠猫，波斯的波斯猫，已经被人类驯化了3500年（但未像狗一样完全地被驯化）。"
    }
}


.textBox {
    -webkit-line-clamp: 1;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    white-space: normal;
}

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/花生_TL007/article/detail/91696