Как передавать data-id кнопок в vue.js компонент при клике?

1
2
3
4
5

<template>
  <div>
    <button v-for="button in buttons" :key="button.id" @click="handleButtonClick(button.id)">{{ button.title }}</button>
  </div>
</template>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19

<script>
export default {
  data() {
    return {
      buttons: [
        { id: 1, title: 'Кнопка 1' },
        { id: 2, title: 'Кнопка 2' },
        { id: 3, title: 'Кнопка 3' }
      ]
    };
  },
  methods: {
    handleButtonClick(id) {
      console.log('Нажата кнопка с id:', id);
      // Выполните нужные действия с использованием id
    }
  }
};
</script>