在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 读取图片文件的大小
Jun 25 Javascript
JS代码优化技巧之通俗版(减少js体积)
Dec 23 Javascript
页面装载js及性能分析方法介绍
Mar 21 Javascript
使用Plupload实现直接上传附件至七牛云存储
Dec 26 Javascript
jQuery实现自定义下拉列表
Jan 05 Javascript
setTimeout内不支持jquery的选择器的解决方案
Apr 28 Javascript
Javascript闭包实例详解
Nov 29 Javascript
JavaScript中Object.prototype.toString方法的原理
Feb 24 Javascript
js获取指定字符前/后的字符串简单实例
Oct 27 Javascript
vue计算属性及使用详解
Apr 02 Javascript
jQuery表单元素过滤选择器用法实例分析
Feb 20 jQuery
vue过滤器用法实例分析
Mar 15 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
虹吸壶煮咖啡26个注意事项
2021/03/03 冲泡冲煮
PHP中的超全局变量
2006/10/09 PHP
PHP中获取文件扩展名的N种方法小结
2012/02/27 PHP
用PHP编写和读取XML的几种方式
2013/01/12 PHP
给WordPress的编辑后台添加提示框的代码实例分享
2015/12/25 PHP
收藏一些不常用,但是有用的代码
2007/03/12 Javascript
javascript学习笔记(十二) RegExp类型介绍
2012/06/20 Javascript
Jquery和JS用外部变量获取Ajax返回的参数值的方法实例(超简单)
2013/06/17 Javascript
HTML页面,测试JS对C函数的调用简单实例
2016/08/09 Javascript
jQuery+ajax的资源回收处理机制分析
2017/01/07 Javascript
JS实现的自动打字效果示例
2017/03/10 Javascript
vue双向绑定简要分析
2017/03/23 Javascript
js异步编程小技巧详解
2017/08/14 Javascript
vue注册组件的几种方式总结
2018/03/08 Javascript
Vue实现导航栏点击当前标签变色功能
2020/08/19 Javascript
微信小程序移动拖拽视图-movable-view实例详解
2019/08/17 Javascript
使用 Jest 和 Supertest 进行接口端点测试实例详解
2020/04/25 Javascript
[04:10]DOTA2英雄梦之声_第11期_圣堂刺客
2014/06/21 DOTA
Python中利用xpath解析HTML的方法
2018/05/14 Python
numpy 计算两个数组重复程度的方法
2018/11/07 Python
python re正则匹配网页中图片url地址的方法
2018/12/20 Python
在Python中居然可以定义两个同名通参数的函数
2019/01/31 Python
pygame实现烟雨蒙蒙下彩虹雨
2019/11/11 Python
python 装饰器功能与用法案例详解
2020/03/06 Python
解决python执行较大excel文件openpyxl慢问题
2020/05/15 Python
Ever New加拿大官网:彰显女性美
2018/10/05 全球购物
印尼网上商店:Alfacart.com
2019/03/11 全球购物
波兰电子产品购物网站:Vobis
2019/05/26 全球购物
Ibatis的核心配置文件都有什么
2014/09/08 面试题
什么是符号链接,什么是硬链接?符号链接与硬链接的区别是什么?
2014/01/19 面试题
业务代表的岗位职责
2013/11/16 职场文书
前台文员岗位职责及工作流程
2013/11/19 职场文书
大学自我鉴定范文
2013/12/26 职场文书
中秋晚会活动方案
2014/08/31 职场文书
2014年大学宣传部工作总结
2014/12/19 职场文书
欠款起诉书范文
2015/05/19 职场文书