Vue element-ui使用表格table显示动态获取数据时,如果某一列的值为null或者空,鼠标悬停到这一列就会报错

报错如下:

element-ui.common.js?ccbf:11878 Uncaught DOMException: Failed to execute 'setEnd' on 'Range': There is no child at offset 1.
at VueComponent.handleCellMouseEnter (webpack-internal:///./node_modules/element-ui/lib/element-ui.common.js:11878:13)
at mouseenter (webpack-internal:///./node_modules/element-ui/lib/element-ui.common.js:11609:40)
at invoker (webpack-internal:///./node_modules/vue/dist/vue.esm.js:2026:18)

at HTMLTableCellElement.fn._withTask.fn._withTask (webpack-internal:///./node_modules/vue/dist/vue.esm.js:1825:18)

这是因为该列的值为空,由于使用的是elementui,可以在需要处理的列添加formatter属性,如下:

<el-table-column prop="desc" label="描述" :formatter="if_null">
</el-table-column>

if_null函数可以这么写 :

if_null:function(row,column){
    return row.desc ? desc : '无';
}

发表回复

您的电子邮箱地址不会被公开。