javascript - vue validator如何校验2个input 同时满足a小于b这种校验？

Question

我这么写会碰到问题是，expect_max_price校验失败（greaterThan为true），然后我去修改expect_min_price把expect_min_price改小此时只能让lessThan变false，单不能把greaterThan变false

<input type="number" name="expect_min_price" style="width: 50px;"
:value="demand.expect_min_price"
 v-validate:expect_min_price="{ required: true, minOrNaN: 0.01, lessThan:'expect_max_price' }"
>
至
<input type="number" name="expect_max_price" style="width: 50px;"                          :value="demand.expect_max_price"
v-validate:expect_max_price="{ required: true, greaterThan:'expect_min_price' }"
>

<script>
   Vue.validator('lessThan', function (val, rule) {
        val = parseFloat(val);
        if (isNaN(val)) {
            return true;
        }
        var greater = parseFloat($('[name=' + rule + ']').val());
        if (isNaN(greater)) {
            return true;
        }

        return val <= greater;
    });
    Vue.validator('greaterThan', function (val, rule) {
        val = parseFloat(val);
        if (isNaN(val)) {
            return true;
        }
        var less = parseFloat($('[name=' + rule + ']').val());
        if (isNaN(less)) {
            return true;
        }

        return val >= less;
    });
<script>

Answer 1

用计算属性尝试一下