Vue 3 遷移策略筆記 第18節 按鍵修飾符

2021-10-17 14:18:52 字數 778 閱讀 3846

知識儲備

在 vue 2.x 中,允許使用 keycodes 作為v-on的修飾符:

v-on:keyup.13

="submit"

/>

v-on:keyup.enter

="submit"

/>

上面兩種寫法,在 vue 2.x 是等價的。

另外, 我們還可以通過全域性的config.keycodes選項來自定義 alias (別名)。

vue.config.keycodes =

v-on:keyup.112

="showhelptext"

/>

v-on:keyup.f1

="showhelptext"

/>

因為 web 標準已經棄用keyboardevent.keycode,所以 vue 3.x 為了和 web 標準保持一致也不再支援 keycodes。vue 3.x 建議使用按鍵 alias (別名)作為v-on的修飾符。

v-on:keyup.delete

="confirmdelete"

/>

因此,這也意味著config.keycodes也被棄用了。

Vue 3 遷移策略筆記 第13節 函式式元件

知識儲備 函式式元件是一種比較簡單,沒有管理任何狀態,也沒有監聽任何傳遞給它的狀態,也沒有生命週期方法的元件 與之相反的是有stateful components狀態元件 實際上,它只是乙個接受一些 prop 的函式。在這樣的場景下,我們可以將元件標記為functional,這意味它無狀態 沒有響應...

vue3學習筆記

vue3 1.context.emit update xx props.xx 可 v model xx更新xx的值 個人記憶,雙向繫結 需要雙向改變的值 代替 vue2 sync 2.元件上繫結的事件預設是繫結第一層,可使用inheritattrs false 取消預設,在需要繼承的屬性的標籤使用v...

Vue3 學習筆記之 watchEffect

最近在看 vue3 的一些新 feature,順道學習了一些 hooks 程式設計的思想,感覺挺有啟發的。今天就以 watcheffect 這個很小的 case 為例,開啟我的 vue3 學習筆記。對所有初學者來說,vue2 到 vue3 最直觀的改變就是 composition api 幾乎所有的...