有过,项⽬开发的时间⻓了,沉淀了不少业务通⽤全局组件,想把他们统⼀进⾏注册,就封装了⼀个⼩ 插件 当时其实⼀开始也没有什么思路,后来扒了⼀下 elementUI的源码,仿了⼀下它的写法,流程我还⼤概记 得 先是把所有的组件放到⼀个数组中,然后在插件的install⽅法⾥遍历整个数组调⽤Vue.component⽅法 依次注册 最后在main.js⾥引⼊插件,通过Vue.use()进⾏插件注册

components 里面index.js 文件 用来 install 插件 ;

import PageTools from "./PageTools";
import UploadExcel from "./UploadExcel";
import ImageUpload from "./ImageUpload"; export default {
install(Vue) {
console.log(Vue);
// 有了Vue构造函数,可以注册全局指令、全局组件、过滤器等
// ps 可以使用数组遍历install插件
Vue.component("PageTools", PageTools);
Vue.component("UploadExcel", UploadExcel);
Vue.component("ImageUpload", ImageUpload);
},
};

然后再main.js 文件中引入 文件

追问: 你如何理解vue插件,什么事⼉可以⽤插件来做?

其实我理解的所谓插件就是vue做⼀些全局的拓展,增加⼀些它本来没有的功能 你⽐如添加⼀些静态的全局⽅法,再⽐如在原型上挂载⼀些实例属性,或者注册⼀些全局组件或者指令 都算 总的说来,反正只有你能通过Vue构造函数能做到的事⼉基本上都可以搞成插件

就是一些业务功能函数,想要再全局使用的,都可以制作成插件 ;

有没有开发过⼀些vue插件?举例说说 - 批量引入插件的更多相关文章

  1. python 全栈开发,Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)

    昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...

  2. vue前端开发那些事——vue开发遇到的问题

    vue web开发并不是孤立的.它需要众多插件的配合以及其它js框架的支持.本篇想把vue web开发的一些问题,拿出来讨论下.  1.web界面采用哪个UI框架?项目中引用了layui框架.引入框架 ...

  3. vue.js过度&动画、混入&插件

    1.vue  过度动画 1.过度 Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果.Vue 提供了内置的过渡封装组件,该组件用于包裹要实现过渡效果的组件. 语法格式: < ...

  4. 如何在webpack开发中利用vue框架使用ES6中提供的新语法

    在webpack中开发,会遇到一大推问题,特别是babel6升级到babel7,要跟新一大推插件,而对于安装babel的功能就是在webpack开发中,vue中能够是用ES6的新特性: 例如ES6中的 ...

  5. 创建vue项目及引入插件

    部署开发环境 安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 安装webpack cnpm install ...

  6. 基于Vue.js的Web视频播放器插件vue-vam-video@1.3.6 正式发布

    前言 今日正式发布一款基于Vue.js的Web视频播放器插件.可配置,操作灵活.跟我一起来体验吧! 线上地址体验 基于vue3.0和vue-vam-video,我开发了一款在线视频播放器. 网址: h ...

  7. Cordova - 使用Cordova开发iOS应用实战3(添加Cordova控制台插件)

    Cordova - 使用Cordova开发iOS应用实战3(添加Cordova控制台插件) 前文介绍了通过 Safari 的 Web检查器,可以看到控制台输出的信息.但有时这样调试代码不太方便,如果在 ...

  8. vue axios拦截器 + 自编写插件 实现全局 loading 效果;

    项目需求:用自定义的 .gif 图标实现全局 loading 效果:为避免在每个页面手动添加,且简单高效的实现,经查阅资料,最终采用了 vue axios拦截器 + 自编写 loading 插件:下面 ...

  9. Vue导入非模块化的第三方插件功能无效解决方案

    一.问题: 最近在写vue项目时,想引入某些非模块化的第三方插件时,总是发现会有报错.且在与本地运行插件测试对比时发现插件根本没有注入到jQuery中(console.log($.fn)查看当前jq有 ...

  10. 后盾网lavarel视频项目---Vue项目使用vue-awesome-swiper轮播插件

    后盾网lavarel视频项目---Vue项目使用vue-awesome-swiper轮播插件 一.总结 一句话总结: vue中的插件的使用和js插件的使用一样的简单,只是vue插件的引入过程有些不同 ...

随机推荐

  1. 【Mybatis-Plus】05 条件构造器 ConditionConstructor

    理解: 原来叫条件构造器,我一直以为都是封装条件对象 即SQL的查询条件,不过都一样. 其目的是因为的实际的需求灵活多变,而我们的SQL的筛选条件也需要跟着变化, 但是有一些固定的字段固定的方式可以保 ...

  2. SmolLM: 一个超快速、超高性能的小模型集合

    简介 本文将介绍 SmolLM.它集合了一系列最尖端的 135M.360M.1.7B 参数量的小模型,这些模型均在一个全新的高质量数据集上训练.本文将介绍数据整理.模型评测.使用方法等相关过程. 引言 ...

  3. 智慧城市(Smart City)—— 华为预测2025年的10大趋势( Huawei Predicts 10 Megatrends for 2025 )

    原文: https://www.huawei.com/en/news/2019/8/huawei-predicts-10-megatrends-2025 相关: https://www.huawei. ...

  4. 切记:使用nvidia omniverse时一定要用2T的固态硬盘

    最近在用nvidia omniverse时突然发现这样的一个问题,那就是这个软件实在是太太了,一个组件就4个多GB大小,如果安装几个组件后那么几十GB的硬盘就没有了,同时由于这个体积太大,因此再启动和 ...

  5. 如何理解计算机类论文、机器学习论文、人工智能AI论文中的“soft”和“hard”呢?

    如何理解计算机类论文.机器学习论文.人工智能AI论文中的"soft"和"hard"呢? 最近在看论文中总看到带有"soft"和"h ...

  6. 神州笔记本 —— HASEE神州 —— 用户手册(使用功能键)—— 笔记本电脑功能键

    功能键功能: FN+f1 启动/关闭 触摸板 FN+f2 启动/关闭 屏幕背光 FN+f3 启动/关闭 喇叭和外接耳机 FN+f5 减低音量 FN+f6 提高音量 FN+f7 切换屏幕 FN+f8 降 ...

  7. Attempting to use uninitialized value beta2_power -------TensorFlow报错

    版本: Python=3.7 TensorFlow=1.14 具体代码: init=[tf.global_variables_initializer(), tf.local_variables_ini ...

  8. 国产首款IDE环境:数字广东公司联合麒麟软件打造的国内首款适配国产操作系统、蜘蛛创新的集成开发环境CEC-IDE正式亮相

    参考: https://www.youtube.com/watch?v=fOpBEWZVKU0 在中国it历史上继"木兰编程语言(实际上套壳Python),红旗操作系统(实际上套壳Chrom ...

  9. 如何解决单IP爬取网站的单IP受限问题

    由于最近博导承接了一项国家科技项目,需要对大量的网站进行爬取,但是现在的很多网站都使用了反爬手段,比如限制一个session的不同网页的访问时间间隔,甚至更有甚者直接对IP地址也做了限制.对于限制se ...

  10. 实验室深度学习服务器崩溃——Oops: 0000 [#1] SMP NOPTI

    这两天实验室的服务器总是崩溃,重启已经不能解决问题了,由于是跑深度学习的服务器,而且还是承接国家级项目的运行服务器,可以说是实验室的主要生产力了,给出报错的日志: Oct 16 09:42:33 ro ...