<template>
  <div class="my-component">
    <h2>{{ title }}</h2>
    <p>{{ content }}</p>
    <button @click="onClick">Click me</button>
  </div>
</template>

<script>
export default {
  name: 'MyComponent',
  props: {
    title: String,
    content: String
  },
  methods: {
    onClick() {
      // 处理点击事件的逻辑
      console.log('Button clicked');
    }
  }
}
</script>

<style scoped>
.my-component {
  /* 组件的样式 */
}
</style>

<template>
  <div>
    <my-component title="Hello" content="Welcome to my custom component"></my-component>
  </div>
</template>

<script>
import MyComponent from './MyComponent.vue';

export default {
  components: {
    MyComponent
  }
}
</script>