Vue 2.0での複数のキーアップイベントのリッスン

Question

メッセージアプリケーションを開発しており、メッセージボックス（テキストエリア）に複数のイベントリスナーをリストする必要があります。ユーザがenter（@keyup.enter）を押すと、メッセージが自動的に送信されます。ただし、メッセージを整理する場合は、改行を追加することができます。したがって、これを行うには@keyup.shift.enter（SHIFT + ENTER）リスナーを追加します。問題は、ユーザーがSHIFT + ENTERを押して@keyup.enterと@keyup.shift.enterの両方を呼び出す場合です。とにかく@keyup.enterイベントを防ぐためにありますか？これを行うには

<textarea 
    v-model="message" 
    @keyup="typing" 
    @keyup.shift.enter="newLine" 
    @keyup.enter="sendMessage" 
></textarea> 

Answer 1

一つの方法は、@keyup.shift.enterを使用しないことが可能と@keyup.enterのベントハンドラ内では、次のような、そうならばshiftもそうでない場合は、コールnewLinesendMessageよりも、押されているかどうかを確認します

methods: { 
    typing() { 
    console.log("typing") 
    }, 
    newLine() { 
    console.log("newLine") 
    }, 
    sendMessage (event) { 
    if(event.shiftKey){  
     console.log("newLine") 
    } else { 
     console.log("sendMessage") 
    } 
    }  
} 

を

作業フィドルhereを参照してください。