How to select to make v-textfield disappear

Question

for my template I use a v-select and a v-text field for when a certain selected value causes the v-textfield to disappear, but how is this implemented in vuetify?

<template>
  <v-container>
    <v-row>
      <v-col cols="12" sm="3" md="3">
        <v-select
          :items="['A','B']"         
          label="select"         
        ></v-select>
      </v-col>      

      <v-col cols="12" sm="3" md="3">
        <v-text-field         
          label="Show"
        ></v-text-field>
      </v-col>
    </v-row>
  </v-container>
</template>

demathos demathos · Accepted Answer · 2020-10-09T07:58:43

You should use v-if directive to show/hide content based on value like this:

<v-select
  v-if="showSelect"
  :items="['A','B']"         
  label="select"         
></v-select>

and then set showSelect as a boolean in your data:

data () {
  return {
    showSelect: true
  }
}

How to select to make v-textfield disappear

1 Answers