在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 相关文章推荐
event.srcElement+表格应用
Aug 29 Javascript
js 覆盖和重载 函数
Sep 25 Javascript
Jquery提交表单 Form.js官方插件介绍
Mar 01 Javascript
jquery 实现两Select 标签项互调示例代码
Sep 25 Javascript
javascript实现博客园页面右下角返回顶部按钮
Feb 22 Javascript
JQuery中attr方法和removeAttr方法用法实例
May 18 Javascript
总结JavaScript中布尔操作符||与&&的使用技巧
Nov 17 Javascript
Angular懒加载机制刷新后无法回退的快速解决方法
Aug 30 Javascript
如何学JavaScript?前辈的经验之谈
Dec 28 Javascript
angular.js 路由及页面传参示例
Feb 24 Javascript
jQuery选择器之子元素选择器详解
Sep 18 jQuery
vue-cli webpack模板项目搭建及打包时路径问题的解决方法
Feb 26 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中echo()和print()、require()和include()等易混淆函数的区别
2012/02/22 PHP
ThinkPHP5 的简单搭建和使用详解
2018/11/15 PHP
laravel 5.5 关闭token的3种实现方式
2019/10/24 PHP
Apache站点配置SSL强制跳转443
2021/03/09 Servers
脚本吧 - 幻宇工作室用到js,超强推荐base.js
2006/12/23 Javascript
RGB颜色值转HTML十六进制(HEX)代码的JS函数
2009/04/25 Javascript
clientX,pageX,offsetX,x,layerX,screenX,offsetLeft区别分析
2010/03/12 Javascript
jquery 多行滚动代码(附详细解释)
2010/06/17 Javascript
JQuery1.4+ Ajax IE8 内存泄漏问题
2010/10/15 Javascript
ExtJs Excel导出并下载IIS服务器端遇到的问题
2011/09/16 Javascript
jQuery Validate 验证,校验规则写在控件中的具体实例
2014/02/27 Javascript
浅谈JavaScript中的String对象常用方法
2015/02/25 Javascript
js内置对象处理_打印学生成绩单的简单实现
2016/09/24 Javascript
JS实现淡入淡出图片效果的方法分析
2016/12/20 Javascript
微信小程序之滚动视图容器的实现方法
2017/09/26 Javascript
Vue.js 点击按钮显示/隐藏内容的实例代码
2018/02/08 Javascript
微信小程序之自定义组件的实现代码(附源码)
2018/08/02 Javascript
使用JS来动态操作css的几种方法
2019/12/18 Javascript
Python多线程经典问题之乘客做公交车算法实例
2017/03/22 Python
Python加载带有注释的Json文件实例
2018/05/23 Python
Python django框架输入汉字,数字,字符生成二维码实现详解
2019/09/24 Python
Python求解正态分布置信区间教程
2019/11/20 Python
opencv3/python 鼠标响应操作详解
2019/12/11 Python
python如何调用字典的key
2020/05/25 Python
用canvas画心电图的示例代码
2018/09/10 HTML / CSS
找到您丢失的钥匙、钱包和手机:Tile
2017/05/19 全球购物
网络技术支持面试题
2013/04/22 面试题
网络工程师个人的自我评价范文
2013/10/01 职场文书
写自荐信有哪些不宜?
2013/10/17 职场文书
五水共治捐款倡议书
2014/05/14 职场文书
群众路线教育实践活动个人对照检查材料
2014/09/22 职场文书
个人作风纪律整顿整改措施
2014/10/25 职场文书
职场:企业印章管理制度(模板)
2019/10/18 职场文书
新学期新寄语,献给新生们!
2019/11/15 职场文书
MySQL索引知识的一些小妙招总结
2021/05/10 MySQL
OpenCV中resize函数插值算法的实现过程(五种)
2021/06/05 Python