使用官网上的完整校验
async fullValidEvent () {
const errMap = await this.$refs.xTable.fullValidate().catch(errMap => errMap)
if (errMap) {
let msgList = []
Object.values(errMap).forEach(errList => {
errList.forEach(params => {
let { rowIndex, column, rules } = params
rules.forEach(rule => {
msgList.push(`第 ${rowIndex} 行 ${column.title} 校验错误:${rule.message}`)
})
})
})
this.$XModal.message({
status: 'error',
slots: {
default () {
return [
<div class="red" style="max-height: 400px;overflow: auto;">
{
msgList.map(msg => <div>{ msg }</div>)
}
</div>
]
}
}
})
} else {
this.$XModal.message({ status: 'success', message: '校验成功!' })
}
}
表格第一次校验的时候,做了整体校验,校验不通过,当有添加行或者删除行的时候,便只校验操作行,便校验通过了。
原因:
解决:只需要加上fullValidate()方法加上true即可
const errMap = await this.$refs.xTable.fullValidate(true).catch(errMap => errMap)