vue2.0使用组件封装一个button按钮且可以使用单击事件

好的，以下是一个简单的示例：

1. 首先，在你的组件文件中，可以定义一个名为 `MyButton.vue` 的组件，以封装你的按钮。

<template>
  <button @click="handleClick" class="my-button">
    <slot></slot>
  </button>
</template>

<script>
export default {
  name: "MyButton",
  methods: {
    handleClick() {
      this.$emit("click");
    }
  }
};
</script>

<style>
.my-button {
  background-color: #f7f7f7;
  color: #333;
  border: 1px solid #ccc;
  padding: 5px 10px;
  border-radius: 4px;
  cursor: pointer;
}
</style>

2. 在你的父组件中，你可以使用 `MyButton` 组件，并监听 `click` 事件。

<template>
  <div>
    <my-button @click="handleClick">点击我</my-button>
  </div>
</template>

<script>
import MyButton from "@/components/MyButton.vue";

export default {
  components: {
    MyButton
  },
  methods: {
    handleClick() {
      console.log("按钮被点击了！");
    }
  }
};
</script>

这样，你就可以通过使用 `MyButton` 组件来创建一个按钮，并在父组件中监听它的 `click` 事件了。