vue.js 获取当前自定义属性值


Posted in Javascript onJune 01, 2017

假设有一个标签h5, 我们给它添加了一个自定义属性值,(item.id是从动态添加的)

点击h5 标签,如何才能获取当前对应的自定义属性值呢?

想当然的我最开始这样写:

<h5 class="left t-title" @click='getDataId' :data-id="item.id"></h5>

<script>
  methods: {
    getDataId() {
      console.log(this.data-id);
    }
   },
  
</script>

显然,这样是拿不到 data-id的值的。。。。

应该这样做:

<h5 class="left t-title" @click='getDataId(item.id)' :data-id="item.id"></h5>

<script>
  methods: {
    getDataId(id) {
      console.log(id);
    }
   },
  
</script>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery实现弹出div,始终显示在屏幕正中间的简单实例
Mar 08 Javascript
jQuery+CSS3实现四种应用广泛的导航条制作实例详解
Sep 17 Javascript
原生js代码实现图片放大境效果
Oct 30 Javascript
JavaScript数组迭代方法
Mar 03 Javascript
微信小程序实现下载进度条的方法
Dec 08 Javascript
Vue脚手架的简单使用实例
Jul 10 Javascript
如何实现一个webpack模块解析器
Oct 24 Javascript
Angular2使用SVG自定义图表(条形图、折线图)组件示例
May 10 Javascript
原生JS与JQ获取元素的区别详解
Feb 13 Javascript
jQuery实现飞机大战小游戏
Jul 05 jQuery
vue 判断元素内容是否超过宽度的方式
Jul 29 Javascript
vue里使用create, mounted调用方法
Apr 26 Vue.js
VUE使用vuex解决模块间传值问题的方法
Jun 01 #Javascript
vue快捷键与基础指令详解
Jun 01 #Javascript
详解vuejs几种不同组件(页面)间传值的方式
Jun 01 #Javascript
Vue.js中兄弟组件之间互相传值实例
Jun 01 #Javascript
Vue.Draggable实现拖拽效果
Jul 29 #Javascript
JS请求servlet功能示例
Jun 01 #Javascript
vue.js加载新的内容(实例代码)
Jun 01 #Javascript
You might like
一段防盗连的PHP代码
2006/12/06 PHP
PHP模块 Memcached功能多于Memcache
2011/06/14 PHP
ThinkPHP CURD方法之data方法详解
2014/06/18 PHP
PHP三种方式实现链式操作详解
2017/01/21 PHP
php生成条形码的图片的实例详解
2017/09/13 PHP
原生js实现跨浏览器获取鼠标按键的值
2013/04/08 Javascript
JS中如何判断传过来的JSON数据中是否存在某字段
2014/08/18 Javascript
JavaScript检查子字符串是否在字符串中的方法
2016/02/03 Javascript
AngularJS实用开发技巧(推荐)
2016/07/13 Javascript
AngularJS 路由详解和简单实例
2016/07/28 Javascript
jQuery图片轮播功能实例代码
2017/01/29 Javascript
详解数组Array.sort()排序的方法
2020/05/09 Javascript
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
2017/08/01 jQuery
AngularJS中下拉框的高级用法示例
2017/10/11 Javascript
基于vue.js的分页插件详解
2017/11/27 Javascript
利用Javascript实现一套自定义事件机制
2017/12/14 Javascript
Vue波纹按钮组件制作
2018/04/30 Javascript
手淘flexible.js框架使用和源代码讲解小结
2018/10/15 Javascript
JavaScript 复制对象与Object.assign方法无法实现深复制
2018/11/02 Javascript
在vue中使用image-webpack-loader实例
2020/11/12 Javascript
简单使用Python自动生成文章
2014/12/25 Python
Python实现删除当前目录下除当前脚本以外的文件和文件夹实例
2015/07/27 Python
利用python批量检查网站的可用性
2016/09/09 Python
python中类的输出或类的实例输出为这种形式的原因
2019/08/12 Python
Django中的FBV和CBV用法详解
2019/09/15 Python
pytorch ImageFolder的覆写实例
2020/02/20 Python
基于virtualenv创建python虚拟环境过程图解
2020/03/30 Python
Python抓包并解析json爬虫的完整实例代码
2020/11/03 Python
纯CSS3实现扇形动画菜单(简化版)实例源码
2017/01/17 HTML / CSS
html5使用canvas画三角形
2014/12/15 HTML / CSS
医院办公室主任职责
2013/12/29 职场文书
电子邮箱格式怎么写
2014/01/12 职场文书
大学生违纪检讨书300字
2014/10/25 职场文书
2015年社会治安综合治理工作总结
2015/04/10 职场文书
超级实用的公文标题大全!
2019/07/19 职场文书
「我的青春恋爱物语果然有问题。-妄言录-」第20卷封面公开
2022/03/21 日漫