반응형
Vue 구성 요소에 Vuelidate $v가 정의되지 않았습니다.
이 문제를 해결한 것은 아무것도 없습니다.이 Vue 컴포넌트에 대해 다음 오류가 발생합니다.Vuelidate 라이브러리를 사용하여 폼의 유효성을 확인하려고 합니다.내가 뭘 놓쳤는지 알아?
Uncaught TypeError: Cannot read property '$v' of undefined
<script>
import Vue from "vue";
import Vuelidate from "vuelidate";
import { required, minLength, email, sameAs } from "vuelidate/lib/validators";
Vue.use(Vuelidate);
const hasUpperCase = (value) =>
value.match(/(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*\W)/);
export default {
validations: {
form: {
Email: {
required: required,
isEmail: email,
},
ConfirmEmail: {
required: required,
isEmail: email,
match: sameAs(this.$v.form.Email),
},
},
},
};
</script>
마이 메인.js
import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import vuetify from "./plugins/vuetify";
import Vuelidate from "vuelidate";
Vue.use(Vuelidate);
Vue.config.productionTip = false;
new Vue({
router,
store,
vuetify,
validations:{},
render: (h) => h(App)
}).$mount("#app");
먼저 다음 명령을 사용하여 설치합니다.npm install vuelidate --save
Import를 통해 글로벌하게 정의할 것을 권장합니다.src/main.js이렇게 줄서다
import Vuelidate from 'vuelidate';
Vue.use(Vuelidate)
이 작업이 완료되면 검증자 클래스를 구성 요소로 가져옵니다.
import { required, minLength, email, sameAs } from "vuelidate/lib/validators";
검증을 작성하기 전에 먼저 데이터 모델을 정의하면 다음과 같은 작업을 수행할 수 있습니다.
data(){
return {
name:"",
email:"",
}
}
이제 검증을 정의할 수 있습니다.
validations:{
name::{
required,alpha
},
email:{
required,email
}
}
마지막으로 해야 할 일은 다음과 같습니다.validations:{}당신의 안에서main.js파일.
언급URL : https://stackoverflow.com/questions/65386444/vuelidate-v-is-undefined-in-vue-component
반응형
'programing' 카테고리의 다른 글
| Vuetifyjs 오류 알 수 없는 사용자 지정 요소: 구성 요소를 올바르게 등록했습니까? (0) | 2022.07.07 |
|---|---|
| 입력 스트림에서 효율적으로 Android 읽기 (0) | 2022.07.07 |
| JS 파일이 외부에서 로드된 경우 Vue에서 공동 구성 요소를 등록할 수 없습니다. (0) | 2022.07.07 |
| HTTP POST를 실행하여 응답을 소비하는 간단한 C 예시 (0) | 2022.07.07 |
| C++ 프로그램에서 scanf()를 사용하는 것이 cin을 사용하는 것보다 빠릅니다. (0) | 2022.07.06 |