vue如何获取自定义元素属性参数值的方法

<span @click="getData($event,'21')">55</span>

getData:function (e,num) {
 console.log(num)
}

<span data-num="21" ref="dataNum" @click="getData($event)">55</span>

getData:function (e) {
 console.log(this.$refs.dataNum.dataset.num);
 }

 <div id="app">
 <span data-num="21" @click="getData($event)">55</span>
 </div>

new Vue({
 el:'#app',
 methods:{
 getData:function (e) {
 console.log(e.target.getAttribute('data-num'))
 }
 }
 })

 <div class="live-dd" numId = "<{$item.id}>"></div>

$('.live-dd').on("click",function(){var num = this.getAttribute('numId');location.href='/live/info?id='+num;})

<span class="vk_cq5" classid="<{$smarty.get.id}>">

var live_id = $('.vk_cq5').attr('classid')

<div> 
 <div id="box" ref="mybox"> 
 DEMO 
 </div> 
 </div>

export default {  
  data () {  
    return {  
        
    }  
  },  
  mounted () {  
    this.init();  
  },  
  methods:{  
    init() {  
      const self = this;  
      this.$refs.mybox.style.color = 'red';  
      setTimeout(() => {  
        self.$refs.mybox.style.color = 'blue';  
      },2000)  
    }  
  }  
  
}