vue 超出多行，省略，展示显示更多按钮

前期准备：根据字体大小和行数确定这个块整体的高度

template

{{desc}}
显示更多

script

 //获取高度是否超过4行判断是否展示查看更多按钮
    getShowMore(){
    const height = this.$refs.desc? this.$refs.desc.clientHeight : 0; //根据元素的clientheight来判断
      if(height > 80){
        this.showButton = true
      }
      else {
        this.showButton = false
      }
    }

style

.desc{
font-size:14px;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-climp:4;
overflow:hidden;
}