如何在Vue.js中从HTML元素中获取id

<template>
  <div>
    <button ref="myButton" @click="getId">Click me</button>
  </div>
</template>

<script>
export default {
  methods: {
    getId() {
      const buttonId = this.$refs.myButton.id;
      console.log(buttonId);
    }
  }
}
</script>

<template>
  <div>
    <button id="myButton" @click="getId">Click me</button>
  </div>
</template>

<script>
export default {
  methods: {
    getId(event) {
      const buttonId = event.target.id;
      console.log(buttonId);
    }
  }
}
</script>