vue中的修飾符

事件修飾符

1.stop 阻止事件繼續傳播
2.prevent阻止標籤默認行爲
3.captrue 事件捕獲行爲 元素自身觸發的事件先在此處理,而後交給內部元素進行處理
4.self忽略了事件冒泡和事件捕獲的影響只有直接做用在該元素上的事件纔會被調用
5.once事件只觸發一次
6.passive 告訴瀏覽器你不想阻止事件的默認行爲

v-model的修飾符

1.lazy 默認狀況輸入框的值是和數據同步的 添加lazy後變爲change事件再同步
2.number將值轉化爲數值類型
3.trim過濾首尾空格

鍵盤事件的修飾鍵

.ctrl
.alt
.shift
.meta

<!-- Alt + C -->
<input @keyup.alt.67="clear">
<!-- Ctrl + Click -->
<div @click.ctrl="doSomething">Do something</div>

與按鍵別名不一樣的是，修飾鍵和 keyup 事件一塊兒用時，事件引起時必須按下正常的按鍵。換一種說法：若是要引起 keyup.ctrl，必須按下 ctrl 時釋放其餘的按鍵；單單釋放 ctrl 不會引起事件。

<!-- 按下Alt + 釋放C觸發 -->
<input @keyup.alt.67="clear">
 
<!-- 按下Alt + 釋聽任意鍵觸發 -->
<input @keyup.alt="other">

<!-- 按下Ctrl + enter時觸發 -->
<input @keydown.ctrl.13="submit">

element的修飾符 (面試回答加分)

對於elementUI的input，咱們須要在後面加上.native, 由於elementUI對input進行了封裝，原生的事件不起做用。

<input v-model="form.name" placeholder="暱稱" @keyup.enter="submit">

<el-input v-model="form.name" placeholder="暱稱" @keyup.enter.native="submit"></el-input>