zoukankan      html  css  js  c++  java
  • Vue.use() 和 Vue.component() 的区别

    官方定义:

    Vue.use( plugin )

    • 参数:

      • {Object | Function} plugin
    • 用法:

      安装 Vue.js 插件。如果插件是一个对象,必须提供 install 方法。如果插件是一个函数,它会被作为 install 方法。install 方法调用时,会将 Vue 作为参数传入。

      该方法需要在调用 new Vue() 之前被调用。

      当 install 方法被同一个插件多次调用,插件将只会被安装一次。

    • 参考:插件

    Vue.component( id, [definition] )

    • 参数:

      • {string} id
      • {Function | Object} [definition]
    • 用法:

      注册或获取全局组件。注册还会自动使用给定的 id 设置组件的名称

      // 注册组件,传入一个扩展过的构造器
      Vue.component('my-component', Vue.extend({ /* ... */ }))
      
      // 注册组件,传入一个选项对象 (自动调用 Vue.extend)
      Vue.component('my-component', { /* ... */ })
      
      // 获取注册的组件 (始终返回构造器)
      var MyComponent = Vue.component('my-component')
    • 参考:组件

    2、当我们想好多地方要是用到同一个组件,又不想每次都在局部注册时,可以在main.js 中全局注册

    main.js

    import common from '@/components/common.vue'
    
    Vue.component(common);

    3、Vue.use() 可以一次性注册多个组件或添加全局方法或属性

    Vue.use(plugin)的初始化方法{install:function(){}}里面可以一次性注册多个组件。
    Vue.component只能一个一个注册。
    install可以做更多的事情
    MyPlugin.install=function(Vue,options){
    //1.添加全局方法或属性
    Vue.myGlobalMethod=function(){
    //逻辑...
    }
    //2.添加全局资源
    Vue.directive('my-directive',{
    bind(el,binding,vnode,oldVnode){
    //逻辑...
    }
    ...
    })
    //3.注入组件选项
    Vue.mixin({
    created:function(){
    //逻辑...
    }
    ...
    })
    //4.添加实例方法
    Vue.prototype.$myMethod=function(methodOptions){
    //逻辑...
    }
    }
  • 相关阅读:
    linux文件系统初探--Day2(3)
    linux文件系统初探--Day2(2)
    linux文件系统初探--Day2(1)
    linux文件系统初探--Day1
    LKD-虚拟文件系统
    linux-nova 安装
    per-file DAX 工作日志(2)
    linux 内核设计与实现——进程管理
    关于用户与服务端密码的校验问题 !mysql php
    [Err] 1055
  • 原文地址:https://www.cnblogs.com/liangziaha/p/15354054.html
Copyright © 2011-2022 走看看