用Vuetify做表单校验,
Vuelidate
https://github.com/vuelidate/vuelidate
yarn add vuelidate
校验表单必须为12位Hex
<template>
<v-text-field
v-model="formData.tagId"
label="Tag ID"
:rules="tagIdRules"
></v-text-field>
</template>
<script>
export default {
name: "AssetFormDialog",
props: { show: Boolean, formData: Object },
data() {
return {
tagIdRules: [
(v) => {
if (v.length != 0) {
let r = /^[0-9a-f]{12}$/;
if (!r.test(v)) {
return "Tag ID format is invalid!";
}
}
return true;
},
],
};
},
methods: {
},
};
</script>