feat: fixed the @keydown.enter function so that it actually works, previously it would not work properly
This commit is contained in:
parent
5036be71e6
commit
64c7f34f41
|
|
@ -26,6 +26,15 @@ const sendMessage = async () => {
|
|||
|
||||
text.value = '';
|
||||
}
|
||||
|
||||
const handleEnter = async (e: KeyboardEvent) => {
|
||||
if (e.shiftKey) {
|
||||
text.value += '\n';
|
||||
} else {
|
||||
e.preventDefault();
|
||||
await sendMessage();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -36,8 +45,8 @@ const sendMessage = async () => {
|
|||
<DialogueContent :messages="messages"></DialogueContent>
|
||||
</div>
|
||||
<q-form @submit="sendMessage" class="row chat-footer">
|
||||
<q-input type="textarea" style="margin-right: 5px;" autogrow v-model="text" label="Enter a Message"
|
||||
class="col" />
|
||||
<q-input v-model="text" label="Enter a Message" autogrow class="col" style="margin-right: 5px;"
|
||||
@keydown.enter="handleEnter" />
|
||||
<q-btn type="submit" :ripple="{ center: true }" color="primary" glossy label="Send"
|
||||
style="align-self: flex-end; width:60px; height:45px; margin-top: 8px; font-size: 14px;" class="col-2">
|
||||
</q-btn>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user