Vuelidate Array

Vuelidate

checkbox validation

@Component({
  mixins: [validationMixin],
  components: {  
    ...
  },
  validations: {  
    checked: { required, minLength: minLength(2), maxLength: maxLength(2) },
    name: { required },  
    phone: { required, numeric, maxLength: maxLength(11) },
    validationGroup: ['checked', 'name', 'phone']
  }
})

validButton() {
  if (!this.$v.validationGroup.$invalid) {  
    return false
  } else {
    return true
  }
}

checked라는 변수는 radio버튼(필수 동의) 2개를 선택하고, 반드시 선택 할 때에만 하단의 버튼이 활성화되는 예제이다. checked변수는 배열(string[])인데, 이때 required 속성을 넣어줘야 정상 동작한다.