Vuerify เป็นปลั๊กอินการตรวจสอบข้อมูลที่ง่ายและมีน้ำหนักเบา กฎการตรวจสอบขั้นพื้นฐานในตัวและพรอมต์ข้อผิดพลาด กฎที่ปรับแต่งได้และประเภทกฎสนับสนุนฟังก์ชั่นปกติหรือสตริง กฎการตรวจสอบสามารถลงทะเบียนทั่วโลกหรือภายในส่วนประกอบ ปลั๊กอินจะเพิ่มวัตถุ $ vuerify ลงใน VM และในเวลาเดียวกันดูข้อมูลและตรวจสอบความถูกต้องตามกฎหมาย หากมีข้อผิดพลาด vm. $ vuerify. $ ข้อผิดพลาดจะถูกเก็บไว้
ติดตั้ง
npm i vuerify -S
ใช้
ติดตั้งปลั๊กอิน
นำเข้า vue จาก 'vue'import vuerify จาก' vuerify'vue.use (vueerify, /* เพิ่มกฎที่กำหนดเอง* /)
เพิ่มกฎที่กำหนดเอง
การทดสอบอาจเป็นฟังก์ชันปกติหรือฟังก์ชั่น
{จำเป็น: {test: // s+$/, ข้อความ: 'ต้องการ'}}ลงทะเบียนภายในส่วนประกอบ
{data () {ชื่อผู้ใช้: '', รหัสผ่าน: ''}, vuerify: {ชื่อผู้ใช้: {ทดสอบ: // w {4,}/, // กฎที่กำหนดเองซึ่งอาจเป็นฟังก์ชัน, กฎการลงทะเบียนปกติหรือทั่วโลกAPI
$ vuerify มีคุณสมบัติต่อไปนี้
NamedEscriptionTypedefault ค่า
$ ข้อผิดพลาดข้อผิดพลาดข้อความผิดพลาดในการตรวจสอบข้อมูลตัวอย่างเช่นหากชื่อผู้ใช้ไม่สามารถตรวจสอบได้มันจะส่งคืน {ชื่อผู้ใช้: 'อย่างน้อย 4 อักขระ'} วัตถุ {}
ไม่ถูกต้องมีฟิลด์ที่ไม่สามารถตรวจสอบ booleantrue ได้
ถูกต้องไม่มีฟิลด์ที่ไม่สามารถตรวจสอบ booleanfalse
ตรวจสอบตรวจสอบฟิลด์ที่ระบุส่งผ่านในอาร์เรย์และส่งคืน booleanfunction (อาร์เรย์)-
เคลียร์ข้อผิดพลาดรายการฟังก์ชั่น-
v-vuerrify
คำสั่งนี้ตรวจสอบข้อมูลและตั้งค่าชื่อคลาสสำหรับส่วนประกอบเมื่อองค์ประกอบฟอร์มทริกเกอร์เหตุการณ์เบลอ (ค่าเริ่มต้นคือ. vuerify-invalid) มันสามารถเป็นส่วนประกอบดั้งเดิมเช่นอินพุตหรืออาจเป็นส่วนประกอบที่ถูกห่อหุ้มด้วยตัวเอง มีสองเวอร์ชัน
ติดตั้ง
# VUE 1.xnpm V-Vuerify -s# VUE 2.0npm V-Vuerify-next -s
การใช้งาน
นำเข้า vue จาก 'vue'import vuerifydirective จาก' v-vuerify '// vue1.ximport vuerifydirective จาก' v-vuerify-next '// vue2.0vue.use (vuerifydirective) <อินพุต V-model = "Username" v-vuerify = "'รหัสผ่าน'"> </xput>
พารามิเตอร์
VerifyinvalidClass
ชื่อคลาสเริ่มต้นคือ vuerify-invalid
<อินพุต v-model = "ชื่อผู้ใช้" v-vuerify = "'ชื่อผู้ใช้'" vuerify-invalid-class = "ข้อผิดพลาด">
เครื่องดัดแปลง
พ่อแม่
หาก Vuerify ลงทะเบียนกับองค์ประกอบหลักคุณจะต้องระบุพาเรนต์เพื่อให้คำสั่งสามารถรับ $ vuerify ที่สอดคล้องกันจากส่วนประกอบพาเรนต์ สำหรับรายละเอียดดูการสาธิต
เหตุการณ์
Vuerify-invalid
vuerify-valid
GitHub: https://github.com/qingwei-li-li/vuerrify