element的table獲取當(dāng)前表格行

需求:驗(yàn)證表格同一行的最低限價(jià)不能超過銷售定價(jià)

思路:先獲取當(dāng)前行table的index,然后在做大小比較

1.局部html

<el-table-column label="銷售定價(jià)(元)" min-width="200px">
  <template slot="header">
    <span class="star">*</span>
    <span class="star-name">銷售定價(jià)(元)</span>
  </template>
  <template slot-scope="scope">
    <el-form-item
      :prop="'skuList.' + scope.$index + '.price'"
      :rules="tableRules.price"
    >
      <el-input
        size="small"
        v-model.trim="scope.row.price"
        @input="userInput"
        placeholder="請輸入銷售定價(jià)"
      />
    </el-form-item>
  </template>
</el-table-column>
 
<el-table-column label="最低限價(jià)(元)" min-width="200px">
  <template slot="header">
    <span class="star">*</span>
    <span class="star-name">最低限價(jià)(元)</span>
  </template>
  <template slot-scope="scope">
    <el-form-item
      :prop="'skuList.' + scope.$index + '.floorPrice'"
      :rules="tableRules.floorPrice"
    >
      <el-input
        size="small"
        v-model.trim="scope.row.floorPrice"
        @input="userInput"
        placeholder="請輸入最低限價(jià)"
      />
    </el-form-item>
  </template>
</el-table-column>

2.驗(yàn)證規(guī)則

const checkFloorPrice = (rule, value, callback) => {
  let index = rule.field.split(".")[1];//獲取當(dāng)前行角標(biāo)
  if (!value) {
    callback(new Error("請輸入最低限價(jià)"));
  } else if (value == Infinity || value > Math.pow(2, 31) - 1) {
    callback(new Error("您填寫的數(shù)字過長"));
  } else if (!/^\d+(\.\d{1,2})?$/.test(value)) {
    callback(new Error("請輸入小數(shù)不超過兩位的自然數(shù)"));
  } else if (value >= this.tableForm.skuList[index].price) {//重點(diǎn)看這里
    callback(new Error("最低限價(jià)不能超過銷售定價(jià)"));
  } else {
    callback();
  }
};
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容