Vue.extend方式实现Toast组件的教程，如何详细解析？

本文共计694个文字，预计阅读时间需要3分钟。

一、效果图

二、说明

这类提示框组件我们通常会在JS代码中直接调用。例如：javascriptthis.$toast('别点啦，到头啦！');但网上大部分还是通过component方式实现的，这种说法我不太认同。

一、效果图

二、说明

这类提示框组件我们通常都会直接在 JS 代码中进行调用。像下面这样：

this.$toast('别点啦，到头啦！')

但看到网上大多数还是通过 component 方式实现的，这样的话我们在使用的时候还要在 DOM 中放置一个组件元素，然后通过一个变量来控制它的显示隐藏，这样使用起来非常的不方便。那么有什么方法可以不用在 DOM 中手动放置组件元素就可以直接调用呢？答案就是 Vue.extend。通过 Vue.extend 方式实现的组件，需要两个文件，一个是 .vue 文件，另外一个就是管理 .vue 的 .js 文件。