for循环el-form-item只校验一个el-input

el-form-item中for循环只校验一个el-input

1. 循环数组，只校验第一个输入框，其他的不进行校验

<el-form :model="formData"
         ref="tempRule"
         label-position="left"
         label-width="100px"
         style="margin: 0 0 0 40px"
         inline>
    <template v-for="(item, index) in formData.reqList">
        <div :key="index">
            <el-form-item :prop="`reqList.${index}.amount`" 
                          :rules="item.billType === 2 ? checkStripe : checkAgree">
                <el-input
                          v-model="item.amount"
                          style="width: 150px; vertical-align: unset"
                          size="mini"
                          oninput="value=value.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/,'$1')"
                          >
                    <template slot="append">元</template>
                </el-input>
            </el-form-item>
        </div>
    </template>
    <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveConfig">保 存</el-button>
    </span>
</el-form>

2. data数据以及校验规则

data(){
    var validateAmount = (rule, value, callback) => {
        if (parseFloat(value) > 0 && parseFloat(value) < parseFloat(0.1)) {
            callback(new Error("金额，则配置金额最少配置0.1"));
        } else {
            callback();
        }
    };
    return {
        formData: {
            reqList: [
                { amount: 0, billType: 1 },
                { amount: 0, billType: 2 },
            ],
        },
        checkStripe: [{ validator: validateAmount, trigger: "blur" }],
        checkAgree: [],
    }
}

3. 提交时使用this.$refs.temprule.validate校验

saveConfig() {
    this.$refs.tempRule.validate((valid) => {
        if (!valid) return;
    },