后来发现,在使用的过程中发现vxe-table的show-overflow在普通的界面是生效的,但是在el-dialog对话框始终不出现
超出的文本鼠标移上去没有显示全部
排查后发现和tooltip的z-index有关,modal的z-index比tooltip的z-index大,
方法一:把相关class改一下就可以显示了
.vxe-table--tooltip-wrapper {
z-index: 10000 !important;
}
方法二:
如果方法一不生效,尝试一下方法二:直接在vxe-table标签上添加:tooltip-config="{ zIndex: 9999 }"即可
<vxe-table :data="tableData" height="500" @checkbox-all="selectAllChangeEvent" @checkbox-change="selectChangeEvent" :header-fixed="true" stripe ref="tableRef" :tooltip-config="{ zIndex: 9999 }">
<vxe-column type="checkbox"></vxe-column>
<vxe-column label="操作" fixed="left" width="50">
<template #default="{ row, $rowIndex }">
...
</template>
</vxe-column>
<vxe-column v-for="(item, index) in tableColumn" :key="index + 'oo'" v-bind="item" :field="item.prop" :title="item.label" width="item.minWidth" show-overflow>
<template v-if="item.prop === 'test_state'" #default="{ row }">
...
</template>
<template v-else-if="item.prop === 'beg_time'" #default="{ row }">
...
</template>
<template v-else-if="item.prop === 'end_time'" #default="{ row }">
...
</template>
<template v-else-if="item.prop === 'unit_id,chl_id'" #default="{ row }">
...
</template>
</vxe-column>
</vxe-table>