div组件作为按钮点击时显示小手样式

最近开发的时候发现用div来做按钮比直接使用el-button方便很多，调整样式也方便，但是如果直接使用div做按钮，鼠标放上面时只显示一个竖着的光标，很不美观，并且不会让用户知道可以点击

<template>
  <div class="detail" @click="handleClick">详情</div>
</template>

<script>
export default {
  methods: {
    handleClick() {
      // 处理点击事件的逻辑

    }
  }
}
</script>

<style>
.detail{
  cursor: pointer;
}
</style>

可以通过为div元素添加cursor属性来改变鼠标样式，使其在被点击时显示小手样式

结果展示