一、定義屬性：

一般定義屬性都是為了動態(tài)的去獲取屬性的值，或者動態(tài)的設(shè)置屬性的值，如果想僅僅是設(shè)置一個普通的屬性，直接在便簽上設(shè)置屬性即可，就像使用html的title、name等屬性一樣，如

H1標簽

。

下面具體說動態(tài)綁定自定義屬性：

在元素標簽上通過v-bind:propName = ‘valueInData’? ?解釋：propName 是自己指定的屬性名，valueInData是定義在Vue實例的data中的屬性名。v-bind的指令也可以使用半角的冒號代替。

二、獲取屬性：

三種方法：

1. 通用方法：

在添加了自定義屬性 的元素上，綁定點擊事件(你也可以換成其他的事件，比如mouseEnter等等，此處以點擊事件為例)，在綁定的事件處理函數(shù)中接受一個參數(shù)(通常是event,e等等，你也可以自定義，此處以event參數(shù)為例)，通過：event.currentTarget.getAttribute('propName?');就可以獲取到，此處用currentTarget是指你點擊的元素的外層包裹的元素，如果換成target,就指的是你實際點擊的元素，建議使用currentTarget，因為如果你的自定義屬性的元素內(nèi)層含有子元素，使用target獲取到的是子元素，獲取的屬性自然也是null,如果想了解target與currenTarget更多區(qū)別，請猛戳這里：https://juejin.im/post/59f16ffaf265da43085d4108

2. 函數(shù)傳參的形式：

提交

methods:{

handleSubmit(a,b){

console.log(b);? ? ? ? //300

}

}

3. 通過設(shè)置ref屬性：

原理：通過給元素設(shè)置ref屬性，獲取到該元素，然后再獲取該元素的屬性值；方便使用。

代碼：

提交

methods :{

handleSubmit(event){

const? theEle = this . $refs . myTargetEle;? ? ?//獲取到元素

console.log(theEle . name);

}

}

三、綁定img標簽的src屬性時，圖片不顯示的問題：

在生成src值的位置(注意不是在html標簽上)，給圖片路徑外層加上 require (? //圖片路徑? ?)；? 即可。

總結(jié)

以上是生活随笔為你收集整理的vue设置img大小的属性_Vue.js自定义标签属性并获取属性，及绑定img的src属性的坑...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。