Vue 鍵盤事件及鍵值修飾符(alt:enter)、雙向數據綁定

一.鍵盤事件及鍵值修飾符(alt:enter)

1.鍵盤事件keyup,只要按鍵就會觸發相應函數。

2.keyup后面接的修飾符enter表示,只有按下enter鍵才會觸發對應函數。

3.修飾符可添加多個,接enter和alt修飾符表示,同時按下alt和enter鍵才會觸發。


二.雙向數據綁定

1. 只能應用于input select textarea

2. 方法一:input的ref屬性可用于標記。鍵盤事件觸發logName方法,通過“this.$refs.ref屬性值.value”獲取到input中實時輸入的數據。將這個數據賦值給vue對象中的(“this.name”)name屬性,從而實時修改span標簽中的name。實現雙向數據綁定


2. 方法二:v-model,這里v-model獲取的name就是vue對象中的name屬性,所以vue中的name設置的默認值hello,可以直接附在輸入框內。改動input中的輸入值,會相應的修改vue中的name屬性,從而修改span標簽中的那么。實現雙向數據綁定


?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容