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 相关文章推荐
ExtJS Grid使用SimpleStore、多选框的方法
Nov 20 Javascript
javascript中的document.open()方法使用介绍
Oct 09 Javascript
JS Attribute属性操作详解
May 19 Javascript
Bootstrap Table使用方法详解
Aug 01 Javascript
纯js模仿windows系统日历
Feb 04 Javascript
Webpack中publicPath路径问题详解
May 03 Javascript
详解js的视频和音频采集
Aug 09 Javascript
vue 父组件给子组件传值子组件给父组件传值的实例代码
Apr 15 Javascript
vue-cli3 项目优化之通过 node 自动生成组件模板 generate View、Component
Apr 30 Javascript
微信小程序 swiper 组件遇到的问题及解决方法
May 26 Javascript
浅探express路由和中间件的实现
Sep 30 Javascript
你不知道的 TypeScript 高级类型(小结)
Aug 28 Javascript
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/10/09 PHP
一个简单至极的PHP缓存类代码
2015/10/23 PHP
php防止sql注入的方法详解
2017/02/20 PHP
PHP 实现重载
2021/03/09 PHP
在javascript将NodeList作为Array数组处理的方法
2010/07/09 Javascript
jquery div 居中技巧应用介绍
2012/11/24 Javascript
DWZ table的原生分页浅谈
2013/03/01 Javascript
javascript实现简单的Map示例介绍
2013/12/23 Javascript
js获取上传文件大小示例代码
2014/04/10 Javascript
jquery 获取 outerHtml 包含当前节点本身的代码
2014/10/30 Javascript
AspNet中使用JQuery上传插件Uploadify详解
2015/05/20 Javascript
玩转JavaScript OOP - 类的实现详解
2016/06/08 Javascript
利用js编写响应式侧边栏
2016/09/17 Javascript
jQuery无缝轮播图代码
2016/12/22 Javascript
详解Angular的8个主要构造块
2017/06/20 Javascript
创建简单的node服务器实例(分享)
2017/06/23 Javascript
使用selenium抓取淘宝的商品信息实例
2018/02/06 Javascript
在JS循环中使用async/await的方法
2018/10/12 Javascript
React传值 组件传值 之间的关系详解
2019/08/26 Javascript
jQuery实现穿梭框效果
2021/01/19 jQuery
Python多线程编程简单介绍
2015/04/13 Python
使用C语言扩展Python程序的简单入门指引
2015/04/14 Python
用Python的Django框架来制作一个RSS阅读器
2015/07/22 Python
python3库numpy数组属性的查看方法
2018/04/17 Python
Python3实现对列表按元组指定列进行排序的方法分析
2018/12/22 Python
Python集中化管理平台Ansible介绍与YAML简介
2019/06/12 Python
对Python中class和instance以及self的用法详解
2019/06/26 Python
Python3基于print打印带颜色字符串
2020/07/06 Python
Python用access判断文件是否被占用的实例方法
2020/12/17 Python
python中altair可视化库实例用法
2021/01/26 Python
纯css3制作煽动翅膀的蝴蝶的示例
2018/04/23 HTML / CSS
html5中去掉input type date默认样式的方法
2018/09/06 HTML / CSS
MAC Cosmetics巴西官方网站:M·A·C彩妆
2019/04/18 全球购物
银行自荐信范文
2013/10/07 职场文书
大学生职业生涯十年规划书范文
2014/09/17 职场文书
2015年青年志愿者工作总结
2015/05/20 职场文书