VUE 프로젝트 에서 Element-ui 드 롭 다운 구성 요 소 를 사용 하 는 검증 실효 문 제 를 해결 합 니 다.

질문 설명:
Element-ui 구성 요 소 를 프로젝트 개발 할 때 드 롭 다운 상자 구성 요 소 를 사용 할 수 있 습 니 다.드 롭 다운 상자 구성 요소 의 option 옵션 이 v-if 명령 으로 옮 겨 다 닐 경우,
이렇게 해도 문제 가 없 지만 여러 속성 을 더 하면 더 선택 할 수 있 습 니 다.드 롭 다운 상자 검증 시 실효 문제 가 발생 합 니 다.
문제 현상:

그림 에서 보 듯 이 옵션 을 선 택 했 지만 인증 이 비어 있어 요청 을 제출 할 수 없습니다.
해결 방향:
구성 요소 안의 방법 을 다 찾 아 도 우리 가 사용 하기에 적합 한 것 을 얻 을 수 없다 면,원생 기본 기 를 사용 해 야 한다.
console.log v-model 이 구성 요소 에 연 결 된 속성 을 보 세 요.연 결 된 문자열(일반적으로 String 입 니 다.여기 서 문자열 예 를 들 어 설명 합 니 다)을 출력 하면 Array 입 니 다.
따라서 검증 이 필요 하 다 면 v-model 이 구성 요소 에 연 결 된 속성의 length 가 0 보다 큰 지 직접 판단 하면 됩 니 다.다른 요구 사항 은 댓 글로 남 겨 주세요.
사고 검증:
rules 에 type:'test'를 추가 하 는 것 을 시험 해 본 적 이 있 습 니 다.겉으로 보기 에는 괜 찮 은 것 같 지만 콘 솔 을 열 면 잘못 보 고 했 습 니 다.Unkown rule type text,다음 그림:

type=text 속성 이 없다 니!그래,계속 할 수 밖 에 없어.
설정 을 많이 선택 한 후에 출력 하 는 것 이 배열 이 라면 chexkbox 와 마찬가지 로 v-model 속성 을[]로 바 꿀 수 있 습 니 다.그리고 rules 안의 type:'array'를 실험 해 보 세 요.결 과 는 잘못 보고 되 지 않 지만 검증 도 유효 하지 않 습 니 다.
이 를 통 해 알 수 있 듯 이 Element 는 아직도 밟 혀 있 습 니 다.제 프로젝트 가 긴급 하면 원생 으로 해결 합 니 다.언제 구성 요소 해결 방법 을 찾 으 면 제 가 신속하게 업데이트 하 겠 습 니 다.물론 해결 방법 을 아 시 는 분 도 저 에 게 공유 해 주세요.기술 교 류 를 환영 합 니 다.
해결 코드

if (this.form.STORE_PROVINCE.length === 0 || this.form.STORE_PROVINCE.length == '') {
    this.$message.error('         ')
    return false
  } else {
   //       
  }

이상 이면 해결 할 수 있 습 니 다.
추가 지식:element ui 폼 검증 select label 도 얻 고 value 도 얻 습 니 다.
html 부분

<el-form-item label="    " prop="comName">
    <el-select v-model="ruleForm.comName" placeholder="       " @change="selectGet">
   <el-option v-for="item in ruleForm.options2" :key="item.id" :value="item.id" :label="item.comName"></el-option>
    </el-select>
</el-form-item>

js 부분

//  selectlabel 
selectGet(vId){
  let obj = {};
  obj = this.ruleForm.options2.find((item)=>{//this.ruleForm
  return item.id === vId;//       
  });
  console.log(obj.comName);//    name    label 
},

data return 에서 정의

data(){
  return{
    ruleForm:{
      options:[
        {id:1,comName:'BEIJING'},
        {id:2,comName:'TIANJIN'}
      ]
    }
  
  }
}

이상 의 VUE 프로젝트 에서 Element-ui 드 롭 다운 구성 요 소 를 사용 하 는 검증 실효 문 제 를 해결 하 는 것 은 바로 편집장 이 여러분 에 게 공유 한 모든 내용 입 니 다.참고 하 시기 바 랍 니 다.여러분 들 도 많이 응원 해 주시 기 바 랍 니 다.