需求： 供貨價(jià) >= 銷(xiāo)售價(jià)的一半，不同的城市銷(xiāo)售價(jià)與供貨價(jià)可以特別設(shè)置

分析： 銷(xiāo)售價(jià)是變動(dòng)的旁舰，城市也是變動(dòng)的罪帖，所以表單驗(yàn)證的規(guī)則也是動(dòng)態(tài)的

解決： 用傳參的方式 -> 動(dòng)態(tài)構(gòu)造表單驗(yàn)證規(guī)則

關(guān)鍵查找-> 供貨價(jià) :rules="supplyRule(city.goods_price)"

如下：

<!-- 動(dòng)態(tài)規(guī)則傳參設(shè)置如下 -->
<!-- :rules="supplyRule(city.goods_price)" -->
<el-form
    :model="cityForm" 
    ref="moreform"
    :rules="rules.moreSpec"
    class="city-form">
    <div 
        class="city-item"
        v-for="(city, cidex) in cityForm.cityList"
        :key="cidex+'citylist'"
        >
        <el-checkbox class="mb-3" v-model="city.selected"> 
        <span class="city-name">{{city.city_name}}</span>
        </el-checkbox>
        <div class="city-price-block pl-5">
            <el-form-item 
                class="more-price-item"
                :rules="rules.moreSpec.line_price"
                :prop="'cityList.'+cidex+'.line_price'">
                <el-input class="price-input" v-model="city.line_price" size="small" :disabled="!city.selected" type="number" min="0" inputmode="numeric" pattern="[0-9]*">
                <template slot="prepend">劃線(xiàn)價(jià)</template>
                </el-input>
            </el-form-item>
            <el-form-item 
                class="more-price-item"
                :rules="rules.moreSpec.goods_price"
                :prop="'cityList.'+cidex+'.goods_price'">
                <el-input class="price-input" v-model="city.goods_price" size="small" :disabled="!city.selected" type="number" min="0" inputmode="numeric" pattern="[0-9]*">
                <template slot="prepend">實(shí)售價(jià)</template>
                </el-input>
            </el-form-item>
            <el-form-item 
                class="more-price-item"
                :rules="supplyRule(city.goods_price)"
                :prop="'cityList.'+cidex+'.supply_price'">
                <el-input class="price-input" v-model="city.supply_price" size="small" :disabled="!city.selected" type="number" :min="0" inputmode="numeric" pattern="[0-9]*">
                <template slot="prepend">供貨價(jià)</template>
                </el-input>
            </el-form-item>
        </div>
    </div>
</el-form>

computed: {
    supplyRule() {
        return (goods_price) => {
            let rule = (rule, value, callback) => {
                if (value < goods_price * .5) {
                return callback(new Error(`供貨價(jià)應(yīng)至少為實(shí)售價(jià)的一半披诗，即 >= ${goods_price * .5}`))
                }else {
                callback()
                }
            }
            let  supply_price= [
                {required: true, message: "請(qǐng)?zhí)顚?xiě)價(jià)格", trigger: "blur"}, 
                { validator: rule, trigger: 'blur' }
            ]
            return supply_price
        }
    }
},

后話(huà)：
以上方法一開(kāi)始僅僅是抱著試一下的想法做看看能不能實(shí)現(xiàn)俱萍。因?yàn)槊恳粋€(gè)城市都需要有對(duì)應(yīng)的驗(yàn)證規(guī)則，而每一個(gè)城市的實(shí)售價(jià)都有可能變動(dòng)痊剖。無(wú)法確定這種方法可以保證表單驗(yàn)證可以順得執(zhí)行韩玩。寫(xiě)完之后意外的發(fā)現(xiàn)完全沒(méi)有問(wèn)題。
往往覺(jué)得不確定的代碼寫(xiě)出來(lái)都是問(wèn)題一堆不是嗎陆馁？可是這次不一樣找颓。嘿！也許你也遇到過(guò)這種不抱希望的事情卻出奇的順利叮贩。以上分享击狮，除了一丁點(diǎn)解決方法之外佛析，還有那么些些意外之喜。