mpvue 自定义组件

mpvue 是一个基于 Vue.js 的小程序开发框架，它允许你使用 Vue.js 的语法和开发方式来开发微信小程序。在 mpvue 中，自定义组件的开发与 Vue.js 中的组件开发非常类似。

要创建一个自定义组件，你需要在 mpvue 项目中的 `components` 文件夹下创建一个新的文件夹，用来存放你的组件文件。在这个文件夹中，你需要创建一个 `.vue` 文件来定义你的组件。

在这个 `.vue` 文件中，你可以使用 Vue.js 的语法来编写你的组件。你可以定义数据、计算属性、方法等，并将它们绑定到组件的模板中。

下面是一个简单的自定义组件示例：

<template>
  <div class="custom-component">
    <h1>{{ title }}</h1>
    <button @click="handleClick">{{ buttonText }}</button>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: 'Custom Component'
    },
    buttonText: {
      type: String,
      default: 'Click me'
    }
  },
  methods: {
    handleClick() {
      // 处理点击事件
    }
  }
}
</script>

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

在这个例子中，我们创建了一个名为 `CustomComponent` 的自定义组件。它接受两个 props：`title` 和 `buttonText`，并分别在组件模板中显示。当按钮被点击时，`handleClick` 方法会被调用。

要在页面中使用这个自定义组件，你可以在页面的 `.vue` 文件中引入它，并在模板中使用它，就像使用普通的 Vue.js 组件一样。

希望这个简单的示例能帮助你理解 mpvue 中的自定义组件开发。如果你有更多的问题，请随时提问！