Как передать имена методов из данных в разделе сценария в @click on Vue

Question

Здравствуйте, я новичок в vuetify. Я пытаюсь использовать такие данные. Действие - это имя метода:

data: () => ({
    profile: [
      { title: 'Profile', action: 'userProfile' },
      { title: 'Settings', action: 'UserSettings' },
      { divider: true },
      { title: 'Log out', action: 'userLogout' }
    ]
  }),

В

<app-bar-item v-else :key="item-${index}" to="/">
        <v-list-item-content>
              <v-list-item-title v-text="item.title" @click="userLogout" />
        </v-list-item-content>
</app-bar-item>

, в частности в

@click="userLogout"

что-то вроде @ CLick = "item.action", полученное из данных в секции скрипта

Answer 1

@ клик ожидает метод, а не данные. Что вы можете сделать, это добавить посредническую функцию и передать посреднику item.action. Затем посредник вызовет ожидаемый метод.

<v-list-item-title v-text="item.title" @click="middleman(item.action)" />

...
methods: {
  middleman(action){
    switch(action){
      case 'userProfile':
         //Go to user profile
      break;
      case 'UserSettings':
         // Go to user settings
      break;
      case 'userLogout':
         // Logout the user
      break;
    }

  }
}