vue-element Form表單驗證沒錯卻一直提示錯誤

在使用element-UI 的表單時,發生一個驗證錯誤,已輸入值但驗證的時候卻提示沒有輸入

修改前 <el-form-item>中的prop綁定的是cus_name,而item裏面的控件綁定的名稱是value

<el-form :model="ruleForm" :rules="rules" ref="rules" 
  label-position="left" label-width="100px">
    <el-form-item label="客戶:" prop="Cus_Name">
      <el-select
        placeholder="請選擇"
        filterable
        v-model="ruleForm.value"
        remote
        :remote-method="remoteMethod"
        :loading="loading"
        style="width:100%"
      >
        <el-option
          v-for="item in ruleForm.options"
          :key="item.Cus_ID"
          :label="item.Cus_Name"
          :value="item.Cus_ID"
        ></el-option>
      </el-select>
    </el-form-item>
data() {
    return {
      loading: false,
      ruleForm: {
        value: "", //選擇的值
        options: [], //搜索出來的值
        Address: "",
        //sku搜索列表
        skuvalue: "",
        optionssku: [],
        //銷售金額
        price: "",
        qty: "",
        skus: []
      },
      rules: {
        Cus_Name:{ required:true,message:'請選擇客戶',trigger:'blur'},
        Address:{required:true,message:'請輸入客戶地址',trigger:'blur'}
      }
    };
  },

只需要把prop和《el-form-item》下的v-model綁定的名字改成一樣即可解決

具體是啥原理還不知道。有知道的小夥伴可以評論告訴我

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章