element 表格內容過長時設置隱藏,通過popover彈窗顯示

一、 首先看效果圖:

 二、示例代碼:

<el-table-column prop="safetyRisk" label="安全隱患" width="200">
    <template slot-scope="scope">
          <el-popover
            placement="top-start"
            title="安全隱患"
            width="300"
            trigger="hover"
          >
            <div>{{ scope.row.safetyRisk }}</div>
            <span slot="reference">{{
              scope.row.safetyRisk.substr(0, 30) + "..."
            }}</span>
          </el-popover>
    </template>
</el-table-column>

參考 https://www.jianshu.com/p/7e7b65b99f3d

 

有問題歡迎來微信找我!一起學習成長,交個朋友!^_^

微信搜索:acoolgiser,或者直接掃描

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章