Menyelaras pengesahan
P粉982009874
2023-07-28 09:27:27
<p>Saya mempunyai medan teks untuk koordinat dan saya mahu mengesahkannya menggunakan vee-validate (3.x) dan Vue 2. Saya mencuba dua kaedah berbeza tetapi tidak berjaya. Format koordinat hendaklah "integer atau float, integer atau float", iaitu "latitud, longitud" (hanya satu koma, berbilang koma harus ditandakan sebagai tidak sah). </p><p>Ini ialah medan teks: </p><p><br /></p>
<pre class="brush:html;toolbar:false;"><ValidationProvider v-slot="{ errors }" rules="coordinates_validation">
<v-teks-medan
:label="$t('stations.position')"
:value="positionValue"
:error-messages="errors"
@input="$emit('update:station', { ...station, ...getLatLong($event) })"
@keypress="justNumber"
/>
</ValidationProvider>
</pra>
<p>Berikut ialah dua perkara yang saya cuba tetapi tidak berjaya: </p>
<pre class="brush:js;toolbar:false;">extend("coordinates_validation", {
sahkan: (nilai) =>
koordinat const = value.split(",");
jika (koordinat.panjang !== 2) {
kembali palsu;
}
const trimmedCoordinates = koordinat.map((coord) => coord.trim());
const isValidCoordinate = (coord) =>
kembalikan !Number.isNaN(parseFloat(coord)) && Number.isFinite(coord);
};
kembali (
trimmedCoordinates.every(isValidCoordinate) &&
!trimmedCoordinates.some((coord) => coord === "")
);
},
mesej: i18n.tc("validations.coordinates_incorrect_format"),
});
</pra>
<pre class="brush:js;toolbar:false;">extend('koordinat_pengesahan', {
sahkan: (nilai) =>
const regex = /^d+(.d+)?,s*d+(.d+)?$/;
kembalikan regex.test(nilai);
},
mesej: i18n.tc('validations.coordinates_incorrect_format'),
});
</pra>
<p>Adakah sesiapa tahu cara membetulkannya? </p>
Apabila anda tidak pasti, anda boleh menyemak output melalui console.log.
Sila semak kotak kod saya, saya menggunakan console.log untuk mengeluarkan langkah demi langkah semasa proses pengesahan, membahagikan langkah besar kepada langkah kecil apabila perlu.
Untuk percubaan pertama anda, masalahnya ialah Number.isFinite sentiasa mengembalikan palsu. Ini kerana anda memberikannya kord rentetan, tetapi Number.isFinite menjangkakan nombor. Inilah cara untuk membetulkannya:
Nilai awal anda.split hanya berfungsi dengan koma ",". Saya syorkan pemisahan pada ruang, koma dan koma + sebarang bilangan ruang.
Untuk percubaan kedua anda, hanya menggunakan ungkapan biasa, saya tidak nampak sebarang masalah. Apabila saya meletakkan kod dalam kotak kod yang sama dan menggunakannya sebagai kaedah pengesahan ia berfungsi dengan sempurna.