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 = '';
|
text.value = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleEnter = async (e: KeyboardEvent) => {
|
||||||
|
if (e.shiftKey) {
|
||||||
|
text.value += '\n';
|
||||||
|
} else {
|
||||||
|
e.preventDefault();
|
||||||
|
await sendMessage();
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -36,8 +45,8 @@ const sendMessage = async () => {
|
||||||
<DialogueContent :messages="messages"></DialogueContent>
|
<DialogueContent :messages="messages"></DialogueContent>
|
||||||
</div>
|
</div>
|
||||||
<q-form @submit="sendMessage" class="row chat-footer">
|
<q-form @submit="sendMessage" class="row chat-footer">
|
||||||
<q-input type="textarea" style="margin-right: 5px;" autogrow v-model="text" label="Enter a Message"
|
<q-input v-model="text" label="Enter a Message" autogrow class="col" style="margin-right: 5px;"
|
||||||
class="col" />
|
@keydown.enter="handleEnter" />
|
||||||
<q-btn type="submit" :ripple="{ center: true }" color="primary" glossy label="Send"
|
<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">
|
style="align-self: flex-end; width:60px; height:45px; margin-top: 8px; font-size: 14px;" class="col-2">
|
||||||
</q-btn>
|
</q-btn>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user