插件一般会注册到全局使用

官方编辑插件介绍:https://vuefe.cn/v2/guide/plugins.html

全局组件:

、首先建一个自定义组件的文件夹,比如叫loading,里面有一个index.js,还有一个自定义组件loading.vue,在这个loading.vue里面就是这个组件的具体的内容,比如:

<template>
<div>
loading..............
</div>
</template> <script>
export default { }
</script> <style scoped>
div{
font-size:40px;
color:#f60;
text-align:center;
}
</style>
在index.js中,规定了使用这个组件的名字,以及使用方法,如:


import loadingComponent
from './loading.vue' const loading={
install:function(Vue){
Vue.component('Loading',loadingComponent)
} //'Loading'这就是后面可以使用的组件的名字,install是默认的一个方法
}; export default
loading;
只要在index.js中规定了install方法,就可以像一些公共的插件一样使用Vue.use()来使用,如: import loading from './loading' Vue.use(loading)
这是在入口文件中引入的方法,可以看到就像vue-resource一样,可以在项目中的任何地方使用自定义的组件了,比如在home.vue中使用 <template>
<div>
<Loading></Loading>
</div>
</template>
这样就可以使用成功

转自:https://www.cnblogs.com/670074760-zsx/p/7049806.html

其他全局可参见:https://blog.csdn.net/runonway/article/details/78998631

vue插件 使用use注册Vue全局组件和全局指令的更多相关文章

  1. Vue(2)- v-model、局部组件和全局组件、父子组件传值、平行组件传值

    一.表单输入绑定(v-model 指令) 可以用 v-model 指令在表单 <input>.<textarea> 及 <select> 元素上创建双向数据绑定. ...

  2. 前端笔记之Vue(三)生命周期&CSS预处理&全局组件&自定义指令

    一.Vue的生命周期 生命周期就是指一个对象的生老病死的过程. 用Vue框架,熟悉它的生命周期可以让开发更好的进行. 所有的生命周期钩子自动绑定 this 上下文到实例中,因此你可以访问数据,对属性和 ...

  3. vue自定义组件(vue.use(),install)+全局组件+局部组件

    相信大家都用过element-ui.mintui.iview等诸如此类的组件库,具体用法请参考:https://www.cnblogs.com/wangtong111/p/11522520.html ...

  4. 如何开发和发布一个Vue插件

    前言 Vue 项目开发过程中,经常用到插件,比如原生插件 vue-router.vuex,还有 element-ui 提供的 notify.message 等等.这些插件让我们的开发变得更简单更高效. ...

  5. 手把手教你写vue插件并发布(二)

    前记:上一篇 https://www.cnblogs.com/adouwt/p/9211003.html, 说到了一个完整的vue插件开发.发布的流程,总结下来就讲了这么一个事,如何注入vue, 如果 ...

  6. 从零开始学 Web 之 Vue.js(六)Vue的组件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  7. vue通过extend动态创建全局组件(插件)学习小记

    测试环境:nodejs+webpack,例子是看文章的,注释为自己的理解 创建一个toast.vue文件: <template> <div class="wrap" ...

  8. vue项目组件的全局注册

    在vue-cli项目中,我们经常会封装自己的组件,并且要在多个界面中引用它,这个时候就需要全局注册组件. 首先我们会封装自己的组件,比如twoDimensionTable文件夹下的index.vue: ...

  9. vue自定义全局组件(自定义插件)

    有时候我们在做开发的时候,就想自己写一个插件然后就可以使用自己的插件,那种成就感很强.博主最近研究element-ui和axios的时候,发现他们是自定义组件,但是唯一有一点不同的是,在用elemen ...

随机推荐

  1. 环境变量PS1,修改命令行提示符样式

    推荐模板  export PS1="\[\e[37;40m\][\[\e[31;40m\]\u\[\e[0m@\[\e[33;40m\]\H \[\e[36;40m\]\w\[\e[0m\] ...

  2. Dynamic CRM 2015学习笔记(6)没有足够的权限 - 您没有访问这些记录的权限。请联系 Microsoft Dynamics CRM 管理员

    我们经常遇到下面这种问题:没有足够的权限 - 您没有访问这些记录的权限.请联系 Microsoft Dynamics CRM 管理员.  下面将详细介绍下如何解决这种问题:进不了CRM系统:进了CRM ...

  3. CF1139D Steps to One(DP,莫比乌斯反演,质因数分解)

    stm这是div2的D题……我要对不住我这个紫名了…… 题目链接:CF原网  洛谷 题目大意:有个一开始为空的序列.每次操作会往序列最后加一个 $1$ 到 $m$ 的随机整数.当整个序列的 $\gcd ...

  4. Shiro中的Remember me设置

    1. 在Spring的相关配置文件中加入如下Remember me管理器配置: <!-- rememberMe管理器 --> <bean id="rememberMeMan ...

  5. hdu6148 百度之星程序设计竞赛复赛 (数位dp)

    Valley Numer Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tota ...

  6. navicat primium 快捷键与命令

    1.ctrl+q          打开查询窗口 2.ctrl+/           注释sql语句 3.ctrl+shift +/  解除注释 4.ctrl+r          运行查询窗口的s ...

  7. Java 多线程篇

    先举个例子 计算机的核心是CPU,它承担了计算机所有计算任务,可以把它理解为像一个工厂,时刻在运行. 假定工厂有一个电力系统,工厂有很多车间,一次只能供给一个车间使用,也就是说一个车间开工的时候,其他 ...

  8. php xml操作

    <?php if(!defined('DEDEINC')) { exit("Request Error!"); } function lib_videotag(&$c ...

  9. Redis的主从复制的原理介绍

    redis主从复制 和Mysql主从复制的原因一样,Redis虽然读取写入的速度都特别快,但是也会产生读压力特别大的情况.为了分担读压力,Redis支持主从复制,Redis的主从结构可以采用一主多从或 ...

  10. javaSE eclipse tomocat安装与配置

    ---恢复内容开始--- javaSE       下载:       第一步:百度收索jdk downlaod  下载地址:https://www.oracle.com/technetwork/ja ...