将 vue-material 组件扩展为我自己的组件

Posted 2023-02-23

【中文标题】将 vue-material 组件扩展为我自己的组件

【英文标题】：Extend vue-material components into my own components

【发布时间】：2017-06-23 16:07:31

【问题描述】：

我想扩展 Vue-Material 组件，以便我可以在我的项目中抽象它们；例如有一个名为“my-icon”的图标组件，它会简单地继承/扩展 md-icon 组件。所以在我的项目中，我可以使用它，它只需使用 md-icon。

我尝试使用以下方法创建 MyIcon/index.js：

import VueMaterial from 'vue-material';

export default function install(Vue)     
    Vue.component('my-icon', Vue.extend(VueMaterial.mdIcon));

得到了错误：

[Vue 警告]：无法挂载组件：未定义模板或渲染函数。

我真的希望能够扩展这些组件，而不必为每个组件定义模板，因为那样会重复很多工作。在一个完美的世界里，我可以使用现有的 vue-material 组件，将它们重命名为我想要的，并且能够通过覆盖模板来扩展功能。这样，我可以在大部分工作中使用 vue-material 组件，并在需要时添加/替换，而无需在上游修改我的工作。

有人对此有任何建议/想法吗？

【参考方案1】：

您通过实际重用组件来扩展组件。

<template>
 <div class="myCustomIcon">
   <md-icon></md-icon>
 </div>
</template>
import VueMaterial from 'vue-material';

export default
 components:
  mdIcon
 

【讨论】：

我很担心。我现在已经有了，但希望我可以“通过”模板的功能而不必自己编写。编写自己的模板的结果是，现在我需要支持传递所有属性、数据等，而我真正想要的只是它当前的功能。我希望这是有道理的，并感谢您的回答。