vxe-table的编辑表格只校验临时变动的数据

使用官网上的完整校验

  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)

相关推荐
丁总学Java9 分钟前
微信小程序-npm支持-如何使用npm包
前端·微信小程序·npm·node.js
It'sMyGo19 分钟前
Javascript数组研究09_Array.prototype[Symbol.unscopables]
开发语言·javascript·原型模式
懒羊羊大王呀20 分钟前
CSS——属性值计算
前端·css
李是啥也不会35 分钟前
数组的概念
javascript
道爷我悟了1 小时前
Vue入门-指令学习-v-html
vue.js·学习·html
无咎.lsy1 小时前
vue之vuex的使用及举例
前端·javascript·vue.js
fishmemory7sec1 小时前
Electron 主进程与渲染进程、预加载preload.js
前端·javascript·electron
fishmemory7sec1 小时前
Electron 使⽤ electron-builder 打包应用
前端·javascript·electron
豆豆2 小时前
为什么用PageAdmin CMS建设网站?
服务器·开发语言·前端·php·软件构建
JUNAI_Strive_ving2 小时前
番茄小说逆向爬取
javascript·python