如何在Vue中为特定模型实现通用组件并将其子类化?

时间:2017-04-27 14:57:40

标签: vue.js vuejs2

我有一个通用对话框窗口的Vue组件。它没有模型,还有一些标题,中心和按钮的插槽。

现在我想用表单填充此对话框。显然,模型的细节和内容是特定于包含的形式,以及一般行为(例如验证等)。

处理此要求的首选Vue方法是什么?

1 个答案:

答案 0 :(得分:1)

由于您的对话框组件只是一个带插槽的模板,因此在模板中同时使用通用对话框组件和表单组件最简单,然后只需将表单组件标记放在对话框组件的中心插槽中即可:

<template>
  <my-generic-dialog>
    <template slot="center">
      <my-form></my-form>
    </template>
  </my-generic-dialog>
</template>

正如Bert Evans在评论中提到的,如果您正在寻找一种方法来分离vue组件的一般功能,您可以使用Vue.extend()或{{3} }。