<script> import { mapGetters } from "vuex"; export default { name: "LoginDropdown", computed: { ...mapGetters("login", ["opcionesLogin", "estilos"]) }, data() { return { dropdownActivo: false }; }, } </script> <template> <div class="buttons is-right"> <div class="dropdown" :class="{'is-active': dropdownActivo}" @mouseleave="dropdownActivo = false"> <div class="dropdown-trigger"> <button class="button" aria-haspopup="true" aria-controls="dropdown-menu" type="button" @click="dropdownActivo = !dropdownActivo"> <span class="icon is-small"> <i class="fa fa-solid fa-user-check"></i> </span> <span>Cambiar login</span> <span class="icon is-small"> <i class="fas fa-angle-down" aria-hidden="true"></i> </span> </button> </div> <div class="dropdown-menu" role="menu"> <div class="dropdown-content"> <a class="dropdown-item" v-for="opcion in opcionesLogin" :href="opcion.href"> {{ opcion.nombre }} </a> </div> </div> </div> </div> </template> <style scoped> </style>