題目描述

項(xiàng)目使用vue 2.x， element-ui
客戶有一個(gè)需求： 客戶習(xí)慣使用回車鍵去切換頁面上的控件焦點(diǎn)，客戶想在按鍵盤上的回車鍵的時(shí)候去實(shí)現(xiàn)下一個(gè)組件獲取焦點(diǎn)并繼續(xù)操作（用戶不想按Tab鍵）。

問題：
在vue中如何實(shí)現(xiàn)以下效果： 當(dāng)用戶按鍵盤上的回車鍵時(shí)就相當(dāng)于他按了鍵盤上的Tab鍵所產(chǎn)生的效果。

題目來源及自己的思路

當(dāng)前解決辦法是：

1. 在每個(gè)頁面上添加一個(gè)數(shù)組對象去維護(hù)頁面上所有的組件。
2. 在頁面上的每個(gè)text框和select框上面設(shè)置一個(gè)ref="XXX"引用。
3. 在頁面上的每個(gè)text框和select框上面添加 @keyup.enter.native="selectXXX" 事件去獲取下一個(gè)組件的ref 并獲取焦點(diǎn)。

大家有沒有什么更好的解決方案？ 最好能全局替換掉回車事件，而不需要每個(gè)頁面都去單獨(dú)寫這些事件控制代碼。