在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中各种编码解码函数的区别和注意事项
Aug 19 Javascript
js 数组去重的四种实用方法
Sep 09 Javascript
JavaScript实现的经典文件树菜单效果
Sep 08 Javascript
js实现精确到毫秒的倒计时效果
Aug 05 Javascript
vue快捷键与基础指令详解
Jun 01 Javascript
jQuery实现下拉菜单的实例代码
Jun 19 jQuery
webpack 2的react开发配置实例代码
Jul 28 Javascript
浅谈Angular4实现热加载开发旅程
Sep 08 Javascript
分分钟学会vue中vuex的应用(入门教程)
Sep 14 Javascript
vue2.0开发入门笔记之.vue文件的生成和使用
Sep 19 Javascript
swiper在vue项目中loop循环轮播失效的解决方法
Sep 15 Javascript
JS实现查找数组中对象的属性值是否存在示例
May 24 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中数字0和空值的区别分析
2014/06/05 PHP
php中session_id()函数详细介绍,会话id生成过程及session id长度
2015/09/23 PHP
Netbeans 8.2将支持PHP7 更精彩
2016/06/13 PHP
Yii1.1框架实现PHP极光推送消息通知功能
2018/09/06 PHP
Yii框架操作cookie与session的方法实例详解
2019/09/04 PHP
[原创]后缀就扩展名为js的文件是什么文件
2007/12/06 Javascript
javascript 动态添加事件代码
2008/11/30 Javascript
Prototype RegExp对象 学习
2009/07/19 Javascript
Javascript和Java获取各种form表单信息的简单实例
2014/02/14 Javascript
模拟一个类似百度google的模糊搜索下拉列表
2014/04/15 Javascript
js QQ客服悬浮效果实现代码
2014/12/12 Javascript
JavaScript实现N皇后问题算法谜题解答
2014/12/29 Javascript
JavaScript使用RegExp进行正则匹配的方法
2015/07/11 Javascript
JS自动倒计时30秒后按钮才可用(两种场景)
2015/08/31 Javascript
js判断出两个字符串最大子串的函数实现方法
2016/11/01 Javascript
JavaScript中callee和caller的区别与用法实例分析
2019/06/28 Javascript
layui 数据表格+分页+搜索+checkbox+缓存选中项数据的方法
2019/09/21 Javascript
vue项目中监听手机物理返回键的实现
2020/01/18 Javascript
js this 绑定机制深入详解
2020/04/30 Javascript
详解阿里Node.js技术文档之process模块学习指南
2021/01/04 Javascript
django实现前后台交互实例
2017/08/07 Python
python 筛选数据集中列中value长度大于20的数据集方法
2018/06/14 Python
在python中使用with打开多个文件的方法
2019/01/07 Python
dataframe 按条件替换某一列中的值方法
2019/01/29 Python
python爬虫解决验证码的思路及示例
2019/08/01 Python
python代码xml转txt实例
2020/03/10 Python
HTML5 文件域+FileReader 分段读取文件并上传到服务器
2017/10/23 HTML / CSS
开业庆典策划方案
2014/02/18 职场文书
电焊工岗位职责
2014/03/06 职场文书
超市优秀员工事迹材料
2014/05/01 职场文书
学雷锋树新风演讲稿
2014/05/10 职场文书
小学生保护环境倡议书
2014/05/15 职场文书
物理教育专业求职信
2014/06/25 职场文书
本科毕业论文致谢词
2015/05/14 职场文书
二审答辩状格式
2015/05/22 职场文书
公司与个人合作协议书
2016/03/19 职场文书