Vue插件的简单封装与使用（Toast插件）

一、组件和插件的区别与联系

区别

组件的使用频率往往大于插件
组件的作用范围往往小于插件

联系

插件可以封装组件，组件可以暴露数据给插件

二、 创建目录结构并初始化插件

└── components
 └── toast
  ├── Toast.vue
  └── index.js
  
Toast.vue：

<!-- Toast.vue -->
<template>
  <div class="toast" v-show='isshow'>
    <div>{
  {message}}</div>
  </div>
</template>

<script>
export default {
    
  name: 'Toast',
  data(){
    
    return {
    
      message: