Saya sedang membina aplikasi menggunakan rangka kerja Quasar. Untuk pengesahan borang saya menggunakan vuelidate untuk pengesahan.
Versi Quasar:
» Quasar Pkg..... v2.0.3
» Pkg @quasar/app... v3.0.3
Pengesahan:
"vuelidate":"^0.7.6"
Kod "Serupa" pada asasnya berfungsi dalam aplikasi Quasar 1.X yang lain, tetapi gagal dalam Quasar 2.x:
Konfigurasi but:
import Vuelidate from 'vuelidate';
export default ({ app }) => {
app.use(Vuelidate);
};
Komponen:
<template>
<div>
<q-input
filled
label="Tweets"
type="text"
v-model="$v.tweets.$model"
:error="$v.tweets.$error"
@blur="$v.tweets.$touch"
/>
</div>
</template>
<script>
import { defineComponent } from "vue";
import { required, numeric } from "vuelidate/lib/validators";
export default defineComponent({
name: "StatsForm",
data() {
return {
tweets: null,
};
},
validations: {
tweets: { required, numeric },
},
});
</script>
Kod untuk menggunakan komponen:
<template>
<q-page class="flex justify-center q-ma-md">
<div class="column">
<h1>Twitter Profile Performance Report</h1>
<stats-form />
</div>
</q-page>
</template>
<script>
import { defineComponent } from "vue";
import StatsForm from "../components/StatsForm.vue";
export default defineComponent({
name: "PerformanceReport",
components: {
"stats-form": StatsForm,
},
});
</script>
<style>
h1 {
font-size: 2.5em;
font-weight: 400;
line-height: 1em;
}
</style>
Saya mendapat ralat berikut dalam penyemak imbas saya:
vue-router.esm-bundler.js?f6c4:3248 ReferenceError: process is not defined
at eval (withParams.js?8b99:7)
at Object../node_modules/vuelidate/lib/withParams.js (vendor.f2dee45ef25904390a82.hot-update.js:271)
at __webpack_require__ (app.js:195)
at fn (app.js:460)
at eval (common.js?bca9:14)
at Object../node_modules/vuelidate/lib/validators/common.js (vendor.f2dee45ef25904390a82.hot-update.js:62)
at __webpack_require__ (app.js:195)
at fn (app.js:460)
at eval (alpha.js?d360:8)
at Object../node_modules/vuelidate/lib/validators/alpha.js (vendor.f2dee45ef25904390a82.hot-update.js:18)
Vuelidate v0.7.6 ialah versi yang dikeluarkan pada 23 Oktober 2020, dan hanya serasi dengan Vue 2. Anda menggunakan Vue 3, yang bermaksud anda mesti menggunakan Vuelidate v2