Vue 获取自定义属性的值

在jquery中，如果要获取 data-*** 的值可以通过 $('目标元素').data('属性名') 来获取。

在Vue中如何获取该值呢？

1.换个思路，作为参数传递。

如下代码：

say hi

methods: {
    say(message){
        console.log(message)
    }
}

 

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

say bye

methods: {
    sayBye(e){
        //let msg=e.target.getAttribute('data-msg');
        let msg=e.target.dataset.msg;
        console.log(msg)
    }
}

 

3.通过$refs获取。

say hello

methods: {
    sayHello(){
        let msg=this.$refs.dataMsg.dataset.msg;
        console.log(msg)
    }
}

 

代码完整案例如下：

    
    
    
    




    

       say hi
       say bye
       say hello
    

 

感谢阅读~~