精华内容
下载资源
问答
  • vue获取属性值的方式

    千次阅读 2019-11-04 11:03:27
    vue的一个优势是通过数据绑定减少直接DOM操作,不过有时候需要获取某个标签的属性或设置某个标签的样式,那么其方式如下: 1. 通过$refs获取 <button @click="toHide" ref="mybtn" data-msg="HIDE">按钮<...

    vue的一个优势是通过数据绑定减少直接DOM操作,不过有时候需要获取某个标签的属性或设置某个标签的样式,那么其方式如下:

    1. 通过$refs获取

    <button @click="toHide" ref="mybtn" data-msg="HIDE">按钮</button>
    
    methods:{
        toHide(){
            let msg = this.$refs.mybtn.dataset.msg;   // 获取自定义属性值
            console.log(msg); 
            this.$refs.mybtn.style.display = 'none';  // 设置该标签样式
        }      
    }

    2. 通过e.target.dataset.***或e.target.getAttribute('data-***')获取

    <button @click="sayHi" data-msg="Hi">say hi</button>
    
    methods:{
        sayHi(e){
            console.log(e.target.dataset.msg);  // 获取了自定义属性data-msg的值
        }
    }

    3. 作为参数传递

    <button @click="say('hi')"> say hi</button>
    methods:{
        say(msg){
            console.log(msg);  // 获取到参数传来的值
        }
    }

     

    展开全文
  • vue.js获取data-*自定义属性值 e.srcElement.dataset.idx e.srcElement.dataset.idx,inx是自定义属性名,也许用的到

    vue.js获取data-*自定义属性值

    e.srcElement.dataset.idx

    e.srcElement.dataset.idx,inx是自定义属性名,也许用的到

     

    展开全文
  • <!DOCTYPE html> <... <head> ...meta charset="UTF-8">...script type="text/javascript" src="js/vue.js"></script> <title></title> </head> &l...
    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<script type="text/javascript" src="js/vue.js"></script>
    		<title></title>
    	</head>
    	<body>
        <h1>component-1</h1>
        <hr>
        <!--指令是绑定在标签属性-->
        <!--template标签 -->
        
        <div id="app">
        	<!--属性有-线 ,构造器里需要驼峰-->
    		<panda :here="message"></panda>
        </div>
        <script type="text/javascript">
            var app=new Vue({
                el:'#app',
                data:{
                	message:'china'
                },
                components:{
                	"panda":{
        				template:`<div style="color:green">Panda from {{here}}</div>`,
        				//注册属性
        				props:['here']
                	}
                }
            })
        </script>
    </body>
    </html>
    

     

    展开全文
  • vue 获取自定义属性值

    2021-04-06 16:19:42
    vue 获取自定义属性值的跟触发事件的属性 <div class="ku-menu-item-group" :data-route="item.route" @click="toRoute"> <i class="el-icon-menu"></i> <span class="ku-menu-collapse">...

    vue 获取自定义属性值

      <div class="ku-menu-item-group" :data-route="item.route" @click="toRoute">
           <i class="el-icon-menu"></i>
           <span class="ku-menu-collapse"><i class="el-icon-arrow-right"></i></span>
      </div>
    

    说明:data-route 为自定义属性

     // 方法集合
        methods: {
          toRoute: function (e) {
            let route = e.currentTarget.getAttribute("data-route")
            console.log(route);
          }
        }
    
    展开全文
  • 在jquery中,如果要获取 data-***的可以通过$('目标元素').data('属性名')来获取。在Vue中如何获取呢?1.换个思路,作为参数传递。如下代码:say himethods: {say(message){console.log(message)}}2.通过e....
  • Vue 获取自定义属性

    万次阅读 2018-11-12 19:12:00
    在jquery中,如果要获取 data-*** 的可以通过 $('目标元素').data('属性名') 来获取。 在Vue中如何获取呢? 1.换个思路,作为参数传递。 如下代码: &lt;button @click="say('Hi')"&gt;...
  • 这篇文章主要为大家详细介绍了vue.js 获取当前自定义属性值,具有一定的参考价值,可以用来参考一下。感兴趣的小伙伴,下面一起跟随512笔记的小编两巴掌来看看吧!假设有一个标签h5, 我们给它添加了一个自定义属性值...
  • Vue动态绑定属性和动态获取属性值

    千次阅读 2020-07-09 21:18:16
    基本不用写前端了,虽然Vue不太会,Jquery还是会点的,Jquery可以动态绑定设定,作为Vue这么牛逼优秀的框架,会不支持动态绑定?我今天快被合作的前端小哥给气到了,不行必须得写出来,太气人了,做后端的帮你搞定...
  • export default {name: "center",mounted() {//div 标签获取的方法let topInfowidth = this.$refs.topInfo.style.width;let topInfoheight = this.$refs.topInfo.style.height;console.log("topInfo:"+topInfowidth+...
  • vue获取自定义属性,标签的

    千次阅读 2020-10-23 11:32:15
    自定义属性为data-val,通过e.target.getAttribute()获取。 <span data-val="0" @click="getVal0">点我</span> getVal0(e){ console.log(e.target.getAttribute('data-val')); }, 方式...
  • 主要为大家详细介绍了vue2.0如何获取自定义属性,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • Vue获取DOM元素的属性值

    千次阅读 2018-11-21 15:52:00
    vue中如何获取到DOM元素距离窗口顶部的呢? 1.通过$event获取 html: &lt;div class="sort-item" @click="showFilter($event)"&gt; {{currentFilter}} &lt;div class=...
  • 如果你是想获取data-num的数据,可以这样写:55getData:function (e,num) {console.log(num)}这样就可以取到这个了,如果你是确实想操作DOM,那你可以这样写:55getData:function (e) {console.log(this.$refs....
  • ![图片说明](https://img-ask.csdn.net/upload/201810/18/1539849025_957028.png) vue获取的对象中有属性值,直接使用this.object.属性获取值为空,如何获取属性值
  • <div id="app"> <button drug_code="100" @click="getData($event)">点</button> </div> methods : { getData (e) { console.log(e.target.getAttribute(‘drug_code‘));...}
  • vue获取标签上的属性值

    万次阅读 2019-04-26 10:13:52
    方法一: <div id="app"> <button @click="getData($event,'100')">点我</button> </div> methods : { getData(e,num) { console.log(num); // 输出 100 ...<...
  • vue 获取dom的css属性值

    2019-10-03 23:33:07
    } //获取dom元素高度通过在标签里面定义ref属性,用this.$refs.自定义名称.offsetHight;去获取。 } #topInfo{ overflow: hidden; }   let imgInfo = this.$refs.imgInfo; console.log(imgInfo) if ...
  • 如果你是想获取data-num的数据,可以这样写:55getdata:function (e,num) {console.log(num)}这样就可以取到这个了,如果你是确实想操作dom,那你可以这样写:55getdata:function (e) {console.log(this.$refs....

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,182
精华内容 472
关键字:

vue获取属性值

vue 订阅