vuejs2.0如何获取dom元素自定义属性值
1.设置定义属性值 :data-value=".."
<ul class="header-ul">
<li class="flexcss" v-for="(list,index) in child" :data-value="list.name" @click="changeContent(index,list.name)">{{list.name}}</li>
</ul>
methods: {
changeHeaderContent(index,name){
console.log('cht',index)
console.log('chaname',name)
}
2.直接获取
<div class="c-img-box" @click="gotoDetail(name)" :data-value="name">
data () {
return {
msg: 'Welcome to Your Vue.js App',
name:'czj',
}
},
gotoDetail:function(ev){
console.log(ev);
},
3.通过this.$refs.***获取
1.目标DOM定义ref值:

2.通过 【this.$refs.***.属性名】 获取相关属性的值:
this.$refs.*** 获取到对应的元素

vuejs2.0如何获取dom元素自定义属性值的更多相关文章
- (四)Jsoup 获取 DOM 元素属性值
第一节: Jsoup 获取 DOM 元素属性值 Jsoup获取DOM元素属性值 比如我们要获取博客的href属性值: 我们这时候就要用到Jsoup来获取属性的值 : 我们给下示例代码: package ...
- Jsoup(四)-- Jsoup获取DOM元素属性值
1.获取博客园的博客标题以及博客地址,获取友情链接 2.代码实现: public static void main(String[] args) throws Exception{ // 创建http ...
- vue 组件传递值以及获取DOM元素的位置信息
1.父组件 select_li.vue 1.1 父组件模板 <template> <div id='selectLi' ref="selectLi"> &l ...
- React 点击删除列表中对应项(React 获取DOM中自定义属性)
点击删除按钮,删除列表中对应项本来是React比较基础的应用,可是应用情况变得复杂了以后,我还真想了一会儿才搞定. 简化一下应用场景:点击新增按钮,增加一条输入框,点击输入框旁边的按钮,删除该输入框( ...
- 获取DOM元素位置和尺寸大小
JavaScript获取DOM元素位置和尺寸大小 在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果,这种时候我们经常会用到一些元素位置和尺寸的计算,浏览器兼容性问题也是不可忽 ...
- vue(4)—— vue的过滤器,监听属性,生命周期函数,获取DOM元素
过滤器 vue允许自定义过滤器,我个人认为,过滤器有两种,一种是对数据的清洗过滤,一种是对数据切换的动画过滤 数据切换的动画过滤 这里还是利用前面的动态组件的例子: 这里由于没办法展示动画效果,代码如 ...
- angular学习笔记-angular中怎么获取dom元素
步骤分解: 第一步:给要获取的元素一个ng-model变量,并且绑定事件啦! <div class="home" ng-model="dirName" n ...
- vue获取dom元素注意问题
mounted(){ setTimeout(()=>{ this.contentToggle(); },1000) }, methods:{ contentToggle(){ console.l ...
- vue获取dom元素高度的方法
获取高度: <div ref="自定义名称" > </div>要在钩子mounted里面dom结构生成后去获取dom的高度,宽度,修改样式等操作!!! mo ...
随机推荐
- 【XSY2666】排列问题 DP 容斥原理 分治FFT
题目大意 有\(n\)种颜色的球,第\(i\)种有\(a_i\)个.设\(m=\sum a_i\).你要把这\(m\)个小球排成一排.有\(q\)个询问,每次给你一个\(x\),问你有多少种方案使得相 ...
- 2.5 time 模块
- mac/Linux/centos ssh连接服务器以及跳板机,实现类型Xshell 功能
1. 由于之前一段时间,公司测试服务器需要有跳板机这种操作,由于mac机器上没有类似Xshell这种程序,所以,只能自己造轮子啦. 本程序采用Shell+Expect脚本编写 具体代码请查看:http ...
- mongodb3.6集群搭建:分片+副本集
mongodb是最常用的noSql数据库,在数据库排名中已经上升到了前五.这篇文章介绍如何搭建高可用的mongodb(分片+副本)集群. 在搭建集群之前,需要首先了解几个概念:路由,分片.副本集.配置 ...
- LCA(ST倍增)
时间复杂度: dfs树,求st表(状态数组f):O(NlgN) 处理M个查询:O(MlgN) 总:O((M+N)lgN) #include<iostream> #include<cs ...
- line-height && vertical-align 学习总结
前言 line-height.font-size.vertical-align是设置行内元素布局的关键属性.这三个属性是相互依赖的关系,改变行间距离.设置垂直对齐等都需要它们的通力合作. 行高 lin ...
- JavaScript 的正则也有单行模式了
正则表达式最早是由 Ken Thompson 于 1970 年在他改进过的 QED 编辑器里实现的,正则里最简单的元字符 “.” 在当时所匹配的就是除换行符外的任意字符: "." ...
- AngularJS DI(依赖注入)实现推测
AngularJS DI(依赖注入) http://www.cnblogs.com/whitewolf/archive/2012/09/11/2680659.html 回到angularjs:在框架中 ...
- 代码,python1
def main(): try: number1,number2=eval(input("please enter two number")) result=number1/num ...
- APPLE-SA-2019-3-25-1 iOS 12.2
APPLE-SA-2019-3-25-1 iOS 12.2 iOS 12.2 is now available and addresses the following: CFStringAvailab ...