Flink KeyBy分佈不均勻問題及解決方法
阿新 • • 發佈：2022-06-05
載入或重新整理頁面時直接獲取焦點
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div id="app"> <input ref="inp" type="text"> <button>搜尋</button> </div> <script src="https://unpkg.com/vue@next"></script> <script> const app = Vue.createApp({ mounted(){//要拿到dom，所以必須是mounted this.$refs.inp.focus();//獲取input的dom節點並聚焦 } }); app.mount("#app") </script> </body> </html>
但每次這麼寫比較麻煩，可以用自定義指令的方式
以下的vue自帶的指令
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div id="app"> <input v-focus type="text"> <button>搜尋</button> </div> <script src="https://unpkg.com/vue@next"></script> <script> const app = Vue.createApp({}); app.directive("focus",{//自定義指令 第一個引數是指令名 mounted(el){//el是掛載這個指令的dom節點 el.focus();//聚焦 } }) app.mount("#app") </script> </body> </html>