vue插件

Vue插件

这篇文章，我们来学习一下Vue中的插件如何安装？🤓🤓

1.什么是插件?🧐

插件 (Plugins) 是一种能为 Vue 添加全局功能的工具代码。例如，我们要封装组件库的时候，这个时候，我们编写的组件就是一个插件，插件是通过app.use()来使用的！

import { createApp } from 'vue'

const app = createApp({})

app.use(myPlugin, {
  /* 可选的选项 */
})

2.插件的形式？🧐

一个插件可以是一个拥有 install() 方法的==对象==，也可以直接是一个安装函数本身

export default{
	install(app,options){
	
	}
}

3.插件的应用🧐

1. 通过 app.component() 和 app.directive() 注册一到多个==全局组件或自定义指令==。
2. 通过 app.provide() 使一个资源可被注入进整个应用。
3. 向 app.config.globalProperties 中添加一些全局实例属性或方法

4.插件的编写

简单来说，就是在一个js文件中导出一个拥有install方法的对象。

例如，我们要注册一个全局组件 Hello.vue

Hello.vue

<template>
<div>
	Hello World!!!
</div>
</template>

js

import Hello from './Hello.vue'
export defalut{
	install(app,options){
        	app.component(Hello)
    }
}

使用

const app=createApp({})
app.use(myPlugin)