添加内容溢出时显示完整内容提示的功能

一、如果是表格，可以利用做成这种内容溢出时显示完整内容的效果：

使用:show-overflow-tooltip="true" 实现溢出效果的展示

<el-table v-loading="loading" :data="iceList" @selection-change="handleChange" border>
。。。。。。<el-table-column label="工厂名称" align="left" prop="name" :show-overflow-tooltip="true" />
。。。。。。</el-table>

 :show-overflow-tooltip="true" 是 Element UI 组件库中 el-table-column 的一个属性，用于控制当单元格内容溢出时是否显示工具提示(tooltip)。具体功能是当单元格内容过长无法完全显示时，鼠标悬停在该单元格上会显示完整内容的工具提示，这里设置为 true，表示启用该功能

二、下面再记录为文本"详细配料表"添加内容溢出时显示完整内容提示的功能。

第一种方法：可以使用Element UI的tooltip组件来实现这个功能

<el-form-item label="详细配料表"><el-tooltip :content="dataForm.burden" placement="top" :disabled="!dataForm.burden|| dataForm.burden.length <= 10"><span class="burden-text">{{ dataForm.burden}}</span></el-tooltip>
</el-form-item>

效果：

第二种方法：直接用更简单的内联方式：

      <el-form-item label="详细配料表"><span :title="dataForm.burden">{{ dataForm.burden}}</span></el-form-item>

效果：