vue 插件之install

摘要:
Exportdefault{install(Vue){Vue.direct('copy',direct/index.js:importModalfrom'./modal.Vue'中也有这样的代码;Exportdefault{install(Vue{Vue.component('modal',全局注册…importDirectives from'@/directives';

问题:
学习自定义指令时候,在directive/index.js中有这样一段代码:

import copy from "./copy";

export default {
  install(Vue) {
      Vue.directive('copy', copy);
  },
};

详见:vue自定义指令封装(加深印象)

几天后,看到一个帖子组件的引用方法,在directive/index.js中也有这样一段代码

import Modal from './modal.vue';

export default {
  install(Vue) {
    Vue.component('Modal', Modal);
  },
};

全局注册

...
 import Directives from '@/directives';
 //重点
 Vue.use(Directives);
 ...

又去官网去重新了解了一番

install是开发插件的方法,这个方法的第一个参数是 Vue 构造器,第二个参数是一个可选的选项对象:

MyPlugin.install = function (Vue, options) {
  // 1. 添加全局方法或 property
  Vue.myGlobalMethod = function () {
    // 逻辑...
  }

  // 2. 添加全局资源
  Vue.directive('my-directive', {
    bind (el, binding, vnode, oldVnode) {
      // 逻辑...
    }
    ...
  })

  // 3. 注入组件选项
  Vue.mixin({
    created: function () {
      // 逻辑...
    }
    ...
  })

  // 4. 添加实例方法
  Vue.prototype.$myMethod = function (methodOptions) {
    // 逻辑...
  }
}

总结:

install方法封装完毕后,需要在全局或者单独组件去用vue.use()注册一下使用

应用场景:
自定义指令或者封装组件不想要每次都引入的话,就可以全局暴露出去,然后单独组件直接引用

免责声明:文章转载自《vue 插件之install》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇Flask 中内置的 Session 应用Android开发 ViewPage2下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

全局消息钩子

钩子(Hook),是Windows消息处理机制的一个平台,应用程序可以在上面设置子程以监视指定窗口的某种消息,而且所监视的窗口可以是其他进程所创建的。当消息到达后,在目标窗口处理函数之前处理它。钩子机制允许应用程序截获处理window消息或特定事件。钩子实际上是一个处理消息的程序段,通过系统调用,把它挂入系统。每当特定的消息发出,在没有到达目的窗口前,钩子程...

处理精度丢之-如何解决

通过上篇我们了解到计算机是如何存储浮点数,那精度丢失是在哪产生的? 拿0.1 + 0.2举例: 0.1 转二进制后:0.0 0011 0011 0011 0011 0011 0011 0011 0011 0011 0011 0011 0011 0011 01(转化后是以0011无限循环,二进制为满一进一,所以末尾为01) 0.2: 转二进制后:0.0 01...

python Zope.interface安装使用

一、接口简述 在我们所熟知的面向对象编程语言中,大多提供了接口(interface)的概念。接口在编程语言中指的是一个抽象类型,是抽象方法的集合;它的特点如下: 1、类通过继承接口的方式,来继承接口的抽象方法; 2、接口并不是类(虽然编写类和方法的方式很相似); 3、类描述对象的属性和方法(实现接口的类,必须实现接口内所描述的所有方法,否则必须声明为抽象类...

Vue【你知道吗?】

前言 Vue的由来 Vue最早发布于2014年左右,作者是美中国学生尤雨溪。Vue 的定位就是为前端开发提供一个低门槛,高效率,但同时又能够伴随用户成长的框架 尤雨溪谈Vue.js :缔造自由与真我 Vue的发展历程 实验阶段(2013 年中到 2014 年 2 月) 0.x 阶段 (2014 年 2 月到 2015 年 10 月) 1.x 阶...

命名空间“System.Windows”中不存在类型或命名空间名“Forms”(是否缺少程序集引用?) ——c#

原因: 新建项目为类库时,项目不会自动引用System.Windows.Forms,当我们使用命名空间System.Windows.Forms时,就会报这个错误 解决方法: 右键引用——添加引用——框架——搜索System.Windows.Forms添加即可...

关于 SetProcessWorkingSetSize 和内存释放

在应用程序中,往往为了释放内存等,使用一些函数,其实,对于内存操作函数要谨慎使用,比如大家常常想到的 SetProcessWorkingSetSize,其实对于windows来说,系统会自动在程序闲置时(如程序被最小化)释放内存的,自己用内存释放 时,往往会造成一些莫名的内存错误,造成自己的应用程序及系统不稳定。 具体原理有人已经写得很清楚了,以下为转帖的...