位置: IT常识 - 正文

认识Vue扩展插件(vue安装插件)

编辑:rootadmin
在 Vue 开发中,实现一个功能有很多种方式可以选择,这依赖于 Vue 强大的功能(指令、混合、过滤、插件等),本文介绍一下插件的开发使用。 ...

推荐整理分享认识Vue扩展插件(vue安装插件),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:很全的vue插件汇总,赶紧收藏下,vuex插件,vuex插件,很全的vue插件汇总,赶紧收藏下,vue项目常用插件,vue的插件,vue 扩展,很全的vue插件汇总,赶紧收藏下,内容如对您有帮助,希望把文章链接给更多的朋友!

众所周知,在 Vue 开发中,实现一个功能可以有很多种方式可以选择,这依赖于 Vue 强大的功能(指令、混合、过滤、插件等),本文介绍一下插件的开发使用。

Vue 插件

插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种:

添加全局方法或者 property。如:vue-custom-element

添加全局资源:指令/过滤器/过渡等。如 vue-touch

通过全局混入来添加一些组件选项。如 vue-router

添加 Vue 实例方法,通过把它们添加到 Vue.prototype 上实现。

认识Vue扩展插件(vue安装插件)

一个库,提供自己的 API,同时提供上面提到的一个或多个功能。如 vue-router

使用插件

vue引入的插件,如 element , 都需要提供 install 方法,因为 Vue.use() 方法会调用插件里的 install 方法

import Vue from 'vue'import Element from 'element-ui'Vue.use(Element)全局组件

类似的全局组件也是同样的做法,在 install 方法里面 进行 组件 注册

import ColorIconComponents from './iconColor.vue'const ColorIcon = { install: function (Vue) { Vue.component('ColorIcon', ColorIconComponents) }}export default ColorIcon绑定prototype

数组对象等绑定自定义方法

// path: src/utils/customFn.jsexport default { install(Vue) { // 数组对象排序 asc-升序 des-降序 Array.prototype.sortListObjByKey = function (key, order = 'asc') { const that = this const comparefn = (obj1, obj2) => { if (order === 'asc') { return obj1[key] - obj2[key] } else { return obj2[key] - obj1[key] } } return that.sort(comparefn) } }}

使用

// path: src/main.jsimport customFn from "./libs/customFn";Vue.use(customFn)开发插件范式

来源

Vue.js 的插件应该暴露一个 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) { // 逻辑... }}

???

? 持续更文,关注我,你会发现一个踏实努力的宝藏前端?,让我们一起学习,共同成长吧。

? 喜欢的小伙伴记得点赞关注收藏哟,回看不迷路 ?

? 欢迎大家评论交流, 蟹蟹?

本文链接地址:https://www.jiuchutong.com/zhishi/313118.html 转载请保留说明!

上一篇:织梦DEDECMS教程:给图片加上自动编号(织梦cms要钱吗)

下一篇:phpcms如何调取栏目图片(phpcms采集教程)

  • 华为nova5i pro支持内存卡吗(华为nova5ipro支持红外线功能吗)

    华为nova5i pro支持内存卡吗(华为nova5ipro支持红外线功能吗)

  • 荣耀v30的指纹识别在哪里(荣耀v30指纹识别不了)

    荣耀v30的指纹识别在哪里(荣耀v30指纹识别不了)

  • 怎找回微信里删除的照片(怎找回微信里删除的群聊)

    怎找回微信里删除的照片(怎找回微信里删除的群聊)

  • 菜鸟裹裹怎么开发票(菜鸟裹裹怎么开票报销)

    菜鸟裹裹怎么开发票(菜鸟裹裹怎么开票报销)

  • 设备驱动程序包可以删吗(设备驱动程序包是什么)

    设备驱动程序包可以删吗(设备驱动程序包是什么)

  • 华为mate30信号不稳定(华为mate30信号不好能维修吗)

    华为mate30信号不稳定(华为mate30信号不好能维修吗)

  • 美团的现金券兑换的密码在哪(美团的现金券兑换在哪里)

    美团的现金券兑换的密码在哪(美团的现金券兑换在哪里)

  • qq打电话为什么自动挂断(qq打电话为什么不显示打电话页面)

    qq打电话为什么自动挂断(qq打电话为什么不显示打电话页面)

  • 快手重置账号还能用吗(快手重置账号还能刷)

    快手重置账号还能用吗(快手重置账号还能刷)

  • 微信投票过于频繁 请稍后重试(微信投票过于频繁会怎样)

    微信投票过于频繁 请稍后重试(微信投票过于频繁会怎样)

  • 华为p30网速慢怎么办(华为p30网速慢怎么回事)

    华为p30网速慢怎么办(华为p30网速慢怎么回事)

  • qq置顶什么意思(qq置顶顺序是按照什么来的)

    qq置顶什么意思(qq置顶顺序是按照什么来的)

  • ipad闹钟没关会响多久(ipad闹钟关了一直有噪音)

    ipad闹钟没关会响多久(ipad闹钟关了一直有噪音)

  • 华为gt2可以插手机卡吗(华为gt2手表可以插卡打电话吗)

    华为gt2可以插手机卡吗(华为gt2手表可以插卡打电话吗)

  • 华为手机有放大器功能吗(华为手机有放大镜功能吗?能看报纸吗?)

    华为手机有放大器功能吗(华为手机有放大镜功能吗?能看报纸吗?)

  • 小米怎么解除网速限制(小米怎么解除网站访问限制)

    小米怎么解除网速限制(小米怎么解除网站访问限制)

  • vivos1电量能用多久(vivos1电池容量多大)

    vivos1电量能用多久(vivos1电池容量多大)

  • ppt超级链接在哪(ppt2003超级链接)

    ppt超级链接在哪(ppt2003超级链接)

  • 人工智能产业链分为哪几个层次(人工智能产业链全景图)

    人工智能产业链分为哪几个层次(人工智能产业链全景图)

  • qq没加好友可以发信息吗(qq没加好友可以举报对方吗)

    qq没加好友可以发信息吗(qq没加好友可以举报对方吗)

  • vivo升降摄像头怎么用(vivo升降摄像头声音怎么关)

    vivo升降摄像头怎么用(vivo升降摄像头声音怎么关)

  • xsmax发热严重(xsmax发热严重卡顿)

    xsmax发热严重(xsmax发热严重卡顿)

  • 企业抖音号怎么注册(企业抖音号怎么申请)

    企业抖音号怎么注册(企业抖音号怎么申请)

  • 抖音评论被禁言多久恢复(抖音评论被禁言多久可以解除)

    抖音评论被禁言多久恢复(抖音评论被禁言多久可以解除)

  • s10截屏快捷键(三星s10截屏快捷方式)

    s10截屏快捷键(三星s10截屏快捷方式)

  • 淘宝如何投诉卖家电话(淘宝如何投诉卖家方法)

    淘宝如何投诉卖家电话(淘宝如何投诉卖家方法)

  • Mac OS X系统中应用程序如何安装与卸载(多种方法)(mac 应用)

    Mac OS X系统中应用程序如何安装与卸载(多种方法)(mac 应用)

  • 无需命令行!教你在Win11傻瓜式安装安卓App(不用指令)

    无需命令行!教你在Win11傻瓜式安装安卓App(不用指令)

  • 非营利组织营利了怎么办
  • 破产企业发放工资要不要纳税?
  • 年度纳税申报表A105000纳税调整项目明细表中,收入
  • 会计凭证的数字书写示例图
  • 储值卡金额算什么科目
  • 购买软件费用
  • 现金流量表抵消分录
  • 全年一次性奖金单独计税怎么算
  • 软件出口税收政策
  • 进口代理费取费标准
  • 没收土地竞买保证金政策法律
  • 当月发票入库核销怎么算
  • 下个月的发票可以报销上个月的费用吗
  • 委托收款有什么用
  • 坏账准备如何计提计算
  • 对于不需要交强险的人
  • 向购买方收取的价外费用
  • 个人独资企业所得税缴纳标准
  • 公司理财取得的成果
  • 投资性房地产公允价值模式账务处理
  • 小规模可以不报增值税吗
  • 境外投资企业如何交税
  • 类似股票期货的产品
  • spf13-vim – Vim编辑器终极发布
  • 英雄联盟登录失败7502013
  • 付款给对方怎么做分录
  • 光伏电站运维费用清单
  • php require的用法
  • pqhelper.exe是什么进程 pqhelper进程查询
  • 销售多余材料的收入会计分录
  • 集团公司收到的上级秘密
  • 因为技术原因
  • 发放职工薪酬账务怎么做
  • YII视图整合kindeditor扩展的方法
  • admit允许
  • 旅行社专票开票内容的规定
  • 分公司发生的业务,开票给总公司
  • SQLite之Autoincrement关键字(自动递增)
  • pandas columns排序
  • 发票过了认证时间期限还可以红冲么
  • 入库材料计入什么科目
  • 会计信息采集每年都要重新写吗
  • SQL SERVER 2008 CTE生成结点的FullPath
  • sql server版本号查看
  • 修改数据库为多个数据
  • 企业的预付账款属于金融资产吗
  • 期末留抵退税计算公式
  • 总结哪些纳税人可以采用简易计税方法
  • 长期股权投资转让会计处理
  • 银行利息收入怎么计算
  • 支付临时工的工资计入应付职工薪酬吗
  • 债券发行后在市场上交易时是怎么确定交易价格的
  • 培训费发票是否可以抵扣
  • sql server在表里查找具体数据
  • linux oos
  • xp系统怎么取消开机登录界面
  • Windows Remote Shell(WinRM)使用介绍
  • fedora32
  • openbsd6.8
  • ubuntu命令行怎么用
  • 电脑开机时出现红色三角形
  • windows用户注册
  • windows8 如何关机
  • win10系统自带输入法怎么关闭
  • perl如何使用
  • cocos creator截图
  • 对于javascript理解
  • android工程目录
  • shell编程总结
  • nodejs的http
  • easyui怎么用
  • javascript基础笔记
  • python使用pymysql实现操作mysql
  • python项目打包发布
  • javascript数据转换
  • 污水处理费收入
  • 个人所得税是先交还是后交
  • 个人所得税房贷能退多少钱
  • 北京市生育津贴发放标准
  • 牛力扳手怎么用
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设