在Vue中获取组件声明时的name属性方法


Posted in Javascript onSeptember 12, 2018

在实际开发中,我们可能需要拿到组件声明时创建的一些属性,比较典型的话就是name属性,在实际开发中需要定位问题时,需要找到是哪一个组件,但是我们总不可能写代码的时候去先找到组件的name属性,然后复制粘贴,作为参数传给函数吧。

例如:

catchError('componentsName', 'errorDescription')

太傻了。

解决办法,获取到组件的this,然后利用this去拿到组件的name属性,这样的话,代码就可以这么写:

catchError.call(this, 'errorDescription')

我们就只需要专注于错误描述就行了(说不定错误描述也是一个变量,那么就更简单咯)。

catchError函数的内容应该这么写:

function catchError (url) {
 console.error(`${this.$options.name} 组件中,以下图片链接不存在,或无法打开:${url}`)
 // 这里可以写一个上报的ajax请求
 // ... do some code
}

完美的解决方案!

以上这篇在Vue中获取组件声明时的name属性方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript学习笔记(一) js基本语法
Oct 25 Javascript
jquery阻止冒泡事件使用模拟事件
Sep 06 Javascript
js数组去重的常用方法总结
Jan 24 Javascript
jquery实现的网页自动播放声音
Apr 30 Javascript
javascript实现数组中的内容随机输出
Aug 11 Javascript
BootStrap使用file-input插件上传图片的方法
Sep 05 Javascript
JS实现仿百度文库评分功能
Jan 12 Javascript
AngularJs上传前预览图片的实例代码
Jan 20 Javascript
js字符串与Unicode编码互相转换
May 17 Javascript
vue脚手架搭建项目的兼容性配置详解
Jul 17 Javascript
js计算两个时间差 天 时 分 秒 毫秒的代码
May 21 Javascript
three.js显示中文字体与tween应用详析
Jan 04 Javascript
浅谈webpack4 图片处理汇总
Sep 12 #Javascript
vue二级菜单导航点击选中事件的方法
Sep 12 #Javascript
vue this.reload 方法 配置
Sep 12 #Javascript
jquery 动态遍历select 赋值的实例
Sep 12 #jQuery
JS中判断字符串存在和非空的方法
Sep 12 #Javascript
React router动态加载组件之适配器模式的应用详解
Sep 12 #Javascript
微信小程序实现tab左右切换效果
Nov 15 #Javascript
You might like
简单的php新闻发布系统教程
2014/05/09 PHP
set_exception_handler函数在ThinkPHP中的用法
2014/10/31 PHP
深入理解PHP JSON数组与对象
2016/07/19 PHP
Laravel5.5 动态切换多语言的操作方式
2019/10/25 PHP
解决php用mysql方式连接数据库出现Deprecated报错问题
2019/12/25 PHP
一个网马的tips实现分析
2010/11/28 Javascript
javascript验证只能输入数字和一个小数点示例
2013/10/21 Javascript
JavaScript实现网页对象拖放功能的方法
2015/04/15 Javascript
jquery实现简单手风琴菜单效果实例
2015/06/13 Javascript
理解JavaScript中Promise的使用
2016/01/18 Javascript
使用jQuery或者原生js实现鼠标滚动加载页面新数据
2016/03/06 Javascript
使用JS轻松实现ionic调用键盘搜索功能(超实用)
2016/09/06 Javascript
jQuery ajax 当async为false时解决同步操作失败的问题
2016/11/18 Javascript
js中常用的Math方法总结
2017/01/12 Javascript
原生js实现拖拽功能基本思路详解
2018/04/18 Javascript
JavaScript原型对象原理与应用分析
2018/12/27 Javascript
vue组件间的参数传递实例详解
2019/04/26 Javascript
WebSocket的简单介绍及应用
2019/05/23 Javascript
VUE的history模式下除了index外其他路由404报错解决办法
2019/08/21 Javascript
微信小程序按钮点击动画效果的实现
2019/09/04 Javascript
[03:08]TI9战队档案 - Vici Gaming
2019/08/20 DOTA
Python实现抓取百度搜索结果页的网站标题信息
2015/01/22 Python
python中pandas.DataFrame的简单操作方法(创建、索引、增添与删除)
2017/03/12 Python
python下10个简单实例代码
2017/11/15 Python
python字典改变value值方法总结
2019/06/21 Python
python批量解压zip文件的方法
2019/08/20 Python
python实现大战外星人小游戏实例代码
2019/12/26 Python
python GUI库图形界面开发之PyQt5控件数据拖曳Drag与Drop详细使用方法与实例
2020/02/27 Python
Python用Jira库来操作Jira
2020/12/28 Python
美国环保婴儿用品公司:The Honest Company
2017/11/23 全球购物
建筑总经理岗位职责
2014/02/02 职场文书
学习雷锋活动总结
2014/04/29 职场文书
企业安全生产标语
2014/06/06 职场文书
护理学专业求职信
2014/06/29 职场文书
遗失说明具结保证书
2015/02/26 职场文书
Nginx 502 bad gateway错误解决的九种方案及原因
2022/08/14 Servers