сохранение выпадающего значения пользователя в vue

#javascript #vue.js #frontend #vue-component

#javascript #vue.js #интерфейс #vue-компонент

Вопрос:

У меня есть приведенный ниже код, который создает выпадающее меню (игнорируйте одинарные кавычки). Выпадающий список выглядит так на моем конце.

здесь не определен вывод журнала. Что я могу сделать, чтобы это сработало?

Ответ №1:

У вас есть @click событие для неправильного элемента.. ваши события @ckick должны быть добавлены к <a> тегам, чтобы вы могли передавать a team_member.email непосредственно в свой метод.

 <div v-if="active" class="dropdown-content">
  <a v-for="team_member in org_team_members"
    :key="team_member.email"
    @click="selectUsersInOrganization(team_member.email)>
    {{ team_member.name }}
  </a>
</div>
 

и метод должен быть:

 selectUsersInOrganization(memberEmail) {
 this.email = memberEmail
 console.log(memberEmail)
}
 

ps. если вам понадобится больше, чем просто электронная почта, вы можете передать весь team_member объект, например:
@click="selectUsersInOrganization(team_member)

таким образом, ваш метод может иметь доступ к свойствам других участников

 selectUsersInOrganization(member) {
 this.email = member.email
 this.name = member.name
 console.log(member)
}