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

Question

我想扩展 Vue-Material 组件，以便我可以在我的项目中抽象它们；例如有一个名为 "my-icon" 的图标组件，它只是 inherit/extend 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 warn]: Failed to mount component: template or render function not defined.

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

有人suggestions/thoughts这方面的吗？

Answer 1

您实际上 re-using 扩展组件。

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

export default{
 components:{
  mdIcon
 }
}

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

Extend vue-material components into my own components

vuejs2

vue-material