在 vue 中，儘量避免對dom的操作，通過對狀態的管理實現需要的功能
舉個例子：
vue獲取dom元素可以使用 ref 要想獲得自定義屬性，可以通過設定 ref 實現

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

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

但是vue 不推薦這樣做，你可以這樣做

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

getData:function (num) {
console.log(num);
}

像這樣的（關於input中的屬性），一般可以放到name空間裡，可以通過$attr屬性獲取相應的值

<input ref="dataNum" name="21" :value="value1"></input>
<span @click="getData">獲取name</span>

getData:function () {
console.log(this.$refs.dataNum.$attr.name);
}

但是這樣為何不直接傳進去狀態值呢

<input v-modle="value1"></input>
<span @click="getData('21')">獲取name</span>

getData:function (num) {
console.log(num);
}

當然操作dom還可以通過e.target操作獲取，還是不推薦

<span data-num="21" @click="getData">55</span>

getData:function (e) {
console.log(e.target.getAttribute('data-num'));
}

vue中的自定義屬性並獲得屬性的值
例如：
data-radius語法： data-屬性

vue:

<div @mouseover='changeRadius($event)' @mouseout='changeRadius(false)' @click='setlocation($event)'>
<div data-radius='100'>100m</div>
<div data-radius='300'>300m</div>
<div data-radius='500'>500m</div>
<div data-radius='1000'>1000m</div>
</div>

獲取屬性的值：ev.target.dataset.radius
methods:

setlocation:function(ev){
this.dispradius = ev.target.dataset.radius + '米'
}