How should the validating code of VUE be optimized?

all three paragraphs have the same small piece of code. How should I optimize the repeated code? and I would like to ask form validation do you all write your own verification rules or use plug-ins? Is it bad for me to write like this

setTimeout(() => {
   ins.close()
}, 800)
return false
if (this.username == "" || this.pw == "" || this.pw2 == "") {
        let ins = this.$toast("")
        setTimeout(() => {
          ins.close()
        }, 800)
        return false
      } else if (regPw.test(this.pw) || regPw.test(this.pw2)) {
        let ins = this.$toast("")
        setTimeout(() => {
          ins.close()
        }, 800)
        return false
      } else if (this.pw !== this.pw2) {
        let ins = this.$toast("")
        setTimeout(() => {
          ins.close()
        }, 800)
        return false
      }
    }
Jan.22,2022

if (this.username == '' || this.pw == '' || this.pw2 == '') {
        let ins = this.$toast('')
       
      } else if (regPw.test(this.pw) || regPw.test(this.pw2)) {
        let ins = this.$toast('')
       
      } else if (this.pw !== this.pw2) {
        let ins = this.$toast('')
      }
      
      setTimeout(() => {
          ins.close()
       }, 800)
        return false
    }else {
    // ajax
    }

like this?


you can refer to elementui's form validation


A simple package would be fine

function showToast(txt) {
    let ins = this.$toast(txt)
    setTimeout(() => {
        ins.close()
    }, 800)
}

function isEmpty(arr) {
    return arr.some(v => v === '')
}

function isEqual(a, b) {
    return a === b
}

function isPasswordValid(pwd) {
    return regPw.test(pwd)
}

function checkValid() {
    const {username, pw, pw2} = this
    
    if (isEmpty([username, pw, pw2])) {
        showToast('')
        return false
    }
    if (!isEqual(pw, pw2)) {
        showToast('')
        return false
    }
    if (!isPasswordValid(pw)) {
        showToast('')
        return false
    }
    return true
}
Menu