首页 > 其他分享 >Vue.prototype、Vue.component和Vue.use的区别

Vue.prototype、Vue.component和Vue.use的区别

时间:2022-08-27 14:33:06浏览次数:54  
标签:use Vue pinyin 插件 组件 prototype

1、Vue.prototype

在很多组件里用到数据/实用工具,但是不想污染全局作用域。这种情况下,可以通过在原型上定义它们使其在每个 Vue 的实例中可用。

$ 是在 Vue 所有实例中都可用的 property 的一个简单约定。这样做会避免和已被定义的数据、方法、计算属性产生冲突
常用于方法与变量

import pinyin from 'js-pinyin';
Vue.prototype.$pinyin = pinyin;

2、vue.component

  • 注册全局组件
  • 第一个参数是调用组件时写的组件名
  • 第二个参数是引入组件时写的标签名称
  •  常用于注册自定义组件
import JsTree from '@/components/JsTree';
Vue.component('JsTree', JsTree);

3、Vue.use

  • 注册全局插件
  • 会自动阻止多次注册相同插件,届时即使多次调用也只会注册一次该插件
  • 插件应该暴露一个 install 方法。这个方法的第一个参数是 Vue 构造器,第二个参数是一个可选的选项对象
  • 常用于注册第三方插件

 

import VueContextMenu from 'vue-contextmenu';
Vue.use(VueContextMenu);

 

 

标签:use,Vue,pinyin,插件,组件,prototype
From: https://www.cnblogs.com/angel648/p/16630522.html

相关文章

  • vue组件中的data为什么是一个函数?
    为什么data为什么是一个函数而不是一个对象?原因是因为如果data是一个对象的话,两个组件中设置的data都会引用同一个内存地址,而用函数的话,则会在每次引用的时候返回一个新的......
  • Leveldb Compile and Use
    先clone下来gitclone--recurse-submoduleshttps://github.com/google/leveldb.git再Buildmkdir-pbuild&&cdbuildcmake-DCMAKE_BUILD_TYPE=Release..&&cma......
  • vue首屏白屏原因及解决办法
    vue首屏白屏原因大概有以下几点:一.路由模式错误由于把路由模式mode设置成history了,默认是hash解决方法:改为hash或者直接删除模式配置,如果非要用的话,在服务端加一个覆盖......
  • vue使用组件<el-date-picker>报错:Avoid mutating a prop directly since the value will
    Vue使用element-ui组件库中的<el-data-picker>标签报错报以下错误,最开始我以为是props通信的问题,但后来发现是版本出现问题导致的解决办法:版本2.14.1的版本已经都不可......
  • MathProblem 43 Wall and two houses problem
    Thereisacastlesurroundedbyacircularwall.Thewallhasanorthgateandasouthgate.Ayellowhouselays3milesnorthofthenorthgate.Abluehouse......
  • ASP.NET Core 6.0+Vue.js 3 实战开发(视频)
    大家好,我是张飞洪,感谢您的阅读,我会不定期和你分享学习心得,希望我的文章或视频能成为你成长路上的垫脚石。录制视频的体验这是一个收费的视频,很抱歉,让您失望了。我尝试......
  • vue3 基础-常用模板语法
    一个vue的单文件SAP(singlepagewebapplication)即在一个.vue为后缀的文件中,会包含3个部分.模板:html逻辑:javascript样式:css这种同时存在,然......
  • vue3使用wangeditor富文本编辑器
     npm下载 1npmiwangeditor-S       在要使用的页面导入1importEWangEditorfrom"wangeditor";2import{onMounted,reactive}from"vue";......
  • ”npm Warn config global `--global`, `--local` are deprecated. Use `--location=
    查找nodejs安装目录,找到如下四个文件分别用记事本打开,替换文档中的prefix-g为prefix--location=global重新打开cmd窗口测试......
  • .htaccess的两种写法和.user.ini
    一、.htaccess文件上传方法一:FileMatch参数即为文件名的正则匹配<FilesMatch"1.jpg"> SetHandlerapplication/x-httpd-php</FilesMatch>//1.jpg<?phpeval($_GET['a......