¿Cómo oculto la tarjeta cuando selecciono el tercer elemento del cuadro de selección? ¿Alguien puede ayudarme con este problema? Soy tan nuevo desarrollador que lo siento mucho.
<b-form-select v-model="InputRatingPlate.RatingPlateTemplate" class="mb-0 input_with_appended_unit2" label-cols-lg="6" > <option> UK-Double Voltage </option> <option> ORCHESTRA </option> <option> VESTAS </option> </b-form-select> </b-form-group> <b-card class="electric-card" v-if="" >Prueba como el siguiente fragmento:
new Vue({ el: '#demo', data() { return { options: ['UK-Double Voltage', 'ORCHESTRA', 'VESTAS'], InputRatingPlate: { RatingPlateTemplate: '' } } } }) <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap/dist/css/bootstrap.min.css" /> <link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.min.css" /> <script src="//unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.min.js"></script> <div id="demo"> <b-form-group> <b-form-select v-model="InputRatingPlate.RatingPlateTemplate"> <option v-for="(opt , i) in options" :key="i"> {{ opt }} </option> </b-form-select> </b-form-group> <b-card v-if="InputRatingPlate.RatingPlateTemplate !== options[2]"> card </b-card> </div>