티스토리 뷰

Working log

[vuejs]Vuetify validation 체크

까오기 2021. 12. 1. 09:08

중복 체크 등 함수 호출할 때 예시입니다. 

<template>
  <v-container>
    <v-row>
      <v-col cols="12" md="4">
        <v-form ref="form">
          <v-text-field
            v-model="id"
            :rules="idRules"
          ></v-text-field>
        </v-form>
      </v-col>
    </v-row>
  </v-container>
</template>
<script>
  export default {
    data: () => ({
      ids: ['aa','bb'],
      id: null
    }),
    computed: {
      idRules () {
        const rules = []
        const rule = v => !!v || 'ID는 필수입니다'
        rules.push(rule)
        const dupRule = v => this.checkId(v) || '동일한 ID가 존재합니다'
        rules.push(dupRule)
        return rules
      },
    },
    methods: {
      checkId(v) {
        for(var i=0;i<this.ids.length;i++){
          if(this.ids === v){
            return false
          }
        }
        return true
      }
  }
</script>
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/04   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30
글 보관함