vue handsontable 插件 如何驗證該行內的某項內容是否填寫 ！

<template>
    <div>
    <hot-table
            ref="searchForm"
            :data="hotSettings.dataList"
            :context-menu="hotSettings.contextMenu"
            :col-headers="hotSettings.colHeaders"
            :start-rows="hotSettings.startRows"
            :start-cols="hotSettings.startCols"
            :row-headers="hotSettings.rowHeaders"
            :row-heights="hotSettings.rowHeights"
            :manual-row-resize="hotSettings.manualRowResize"
            :manual-column-resize="hotSettings.manualColumnResize"
            :manual-row-move="hotSettings.manualRowMove"
            :columns="hotSettings.columns"
            :before-remove-row="hotSettings.beforeRemoveRow"
            :after-create-row="hotSettings.afterCreateRow"
            :after-change="afterChangeMe"
            class="table_hot"
            license-key="non-commercial-and-evaluation"
            />


        <button @click="saveSubmit">xxx</button>
    </div>
</template>

<script>
import { HotTable } from '@handsontable-pro/vue'
import Handsontable from 'handsontable'

const validatorList = (rule, value, callback) => {
    for (let i = 0; i < value.length; i++) {
        if (!value[i].region || !value[i].destination) {
            callback(new Error('請輸入價格表中所有信息, 多余的可通過鼠標右擊進行刪除行'))
            return
        }
    }
    callback()
}

const riseWeightVal = function (value, callback) {
    if (/^\d+(?=\.{0,1}\d+$|$)/.test(value) || value === '') {
        callback(true)
    } else {
        alert('請輸入數字')
        callback(false)
    }
}

export default {
  name: 'app',
  components: {
      HotTable
  },
  data() {
      return {
        //   addressList: [{
        //       area: []
        //   }],
          arr:[],
          demo:['a','b','c','d'],
          hotSettings: {
              dataList: [],  //
              colHeaders:  [ '數據名稱','單位', '小數位', '最小值', '最大值', '最小原始值','最大原始值','寄存器類型','寄存器地址','數據格式','數據位','字節順序','UnitidID'],
              startRows: 8,
              startCols: 6,
              rowHeaders: true,
              rowHeights: 40,
              manualRowResize: true,
              manualColumnResize: true,
              manualRowMove: true,
              customBorders: true,
              columns: [　　　　　　//data: dataList數組中對應的 鍵，readOnly: 只讀， type: 屬於什么類型 例：text, numeric, validator: 數據驗證
                    {
                        data: 'name',  //data上傳對應字段
                    }, 
                    {
                        data: 'unit', //id
                        type: 'dropdown', //下拉選擇
                        source: ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'],
                        strict: false   //是否嚴格匹配
                    },
                    {
                        data: 'decimalPlace', //id
                        type: 'dropdown', //下拉選擇
                        source: ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'],
                        strict: false   //是否嚴格匹配
                    },
                    {
                        data: 'min',  //data上傳對應字段
                        type: 'numeric', //數值
                    }, 
                    {
                        data: 'max',  //data上傳對應字段
                        type: 'numeric', //數值
                    }, 
                    {
                        data: 'oddMin',  //data上傳對應字段
                        type: 'numeric', //數值
                    }, 
                    {
                        data: 'oddMax',  //data上傳對應字段
                        type: 'numeric', //數值
                    }, 
                    {   
                        data: 'type', //id
                        type: 'dropdown', //下拉選擇
                        source: ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'],
                        strict: false ,  //是否嚴格匹配
                    },
                    {
                        data: 'address',  //data上傳對應字段
                        type: 'numeric', //數值
                    }, 
                    {
                        data: 'format',    //id
                        type: 'dropdown', //下拉選擇
                        source: ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'],
                        strict: false   //是否嚴格匹配
                    },
                    {
                        data: 'dataBits', 
                        type: 'dropdown', //下拉選擇
                        source: ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'],
                        strict: false   //是否嚴格匹配
                    },
                    {   
                        data: 'byteOrder',
                        type: 'dropdown', //下拉選擇
                        source: ['BMW', 'Chrysler', 'Nissan', 'Suzuki', 'Toyota', 'Volvo'],
                        strict: false   //是否嚴格匹配
                    },
                    {
                        data: 'unitId',  //data上傳對應字段
                        type: 'numeric', //數值
                    }, 
              ],
              contextMenu: {
                  items: {
                      'row_above': {
                          name: '在此行上方插入行'
                      },
                      'row_below': {
                          name: '在此行下方插入行'
                      },
                      'separator': Handsontable.plugins.ContextMenu.SEPARATOR,
                      'copy': {
                          name: '復制'
                      },
                      'undo': {
                          name: '撤消'
                      },
                      'separator1': Handsontable.plugins.ContextMenu.SEPARATOR,
                      'remove_row': {
                          name: '刪除行'
                      },
                      'clear_column': {
                          name: '刪除列'
                      },
                      'clear_custom': {
                          name: '刪除所有單元格',
                          callback: function () {
                              this.clear()
                          }
                      }
                  }
              }
          },
          expressCompanyList: [],
          dateRange: [],
          typeBol: false,
          searchParam: {
              supplierServiceRegionPriceVos: []
          },
          searchParamRules: {
              supplierServiceRegionPriceVos: [
                  { type: 'array', required: true, message: '請填寫價格表', trigger: 'blur' },
                  { validator: validatorList, required: true, message: '請輸入價格表中所有信息, 多余的可通過鼠標右擊進行刪除行', trigger: 'blur' }
              ]
          },
          showContent: false,
          loadShow: false,
          saveLimit: false
      }
  },
    mounted() {
        for(var i=0;i<10;i++){
            let x = {riseWeight:11}
            this.hotSettings.dataList.push(x)
        }
    },
    methods: {
        // 刪除行之前調用
        beforeRemoveRowMe: function (changes, source) { // 數據改變時觸發此方法
            this.hotSettings.dataList.splice(changes, source)
        },
        // 添加行
        afterCreateRowMe: function (changes) {
            this.hotSettings.dataList.splice(changes, 0, {
                region: '',
                destination: '',
                firstWeight: '',
                firstWeightPrice: '',
                riseWeight: '',
                riseWeightPrice: ''
            })
        },
        //新增行時，動態改變值
        afterChangeMe: function (changes) {
            if (changes) {
                changes.forEach(([row, prop, oldValue, newValue]) => {
                    // console.log(row, prop, oldValue, newValue)
                    this.hotSettings.dataList[row][prop] = newValue
                })
            }
        },
        //查看-excel不可編輯
        excalEdit() {
            this.hotSettings.columns.forEach(par => {
                par.readOnly = true
            })
        },
        definedShow() {
            this.showContent = true
        },
        saveSubmit() {
          this.hotRef = this.$refs.searchForm.hotInstance     //這個是百度到的 用於驗證紅色的驗證錯誤
          this.arr = []
          this.hotRef.validateCells((valid) => {
          if (valid) {
              this.hotSettings.dataList.forEach((item,index)=>{  //想獲取[{name:'vue'},{name:'vue'}] 這種形式必須用this.hotSettings.dataList  而且 columns 中每個對象中的 data ：一定要設置成你后台需要的樣子！
                  if(item.name || item.unit || item.decimalPlace || item.min || item.max || item.oddMin || item.oddMax || item.type || item.address || item.format || item.dataBits || item.byteOrder || item.unitId){
                      if(item.name && item.unit && item.decimalPlace && item.min && item.max && item.oddMin && item.oddMax && item.type && item.address && item.format && item.dataBits && item.byteOrder && item.unitId){
                          this.arr.push(item)
                      }else{
                          alert(`請將第${index+1}行,填寫完整！`)
                      }
                  }
              })
              window.console.log(this.arr,"讓我看看數據對不對是不是我想要的！")
          }else{
              alert('請修改錯誤格式！')
          }
        })    
        },
        // 導出文件
        uploadFile() {
            // 可查看網址https://handsontable.com/docs/7.1.0/ExportFile.html
            const container = this.$refs.tableServer.hotInstance
            const exportPlugin = container.getPlugin('exportFile')
            exportPlugin.downloadFile('csv', {
                bom: 'UTF-8', // 允許您使用BOM簽名導出數據。
                columnDelimiter: ',', // 允許您定義列分隔符。
                columnHeaders: false, // 允許使用列標題導出數據。
                exportHiddenColumns: true, // 允許您從隱藏列導出數據。
                exportHiddenRows: true, // 允許您從隱藏行導出數據
                fileExtension: 'csv', // 允許您定義文件擴展名。
                filename: '供應商服務價格表[YYYY]-[MM]-[DD]', // 允許您定義文件名。
                mimeType: 'text/csv', // 允許您定義MIME類型。
                rowDelimiter: '\r\n', // 允許您定義行分隔符。
                rowHeaders: true // 允許您使用行標題導出數據。
            })
        }
    }
}

</script>
     
<style>
@import '~handsontable/dist/handsontable.full.css';
</style>