@Submit not working in Vue typescript

This content originally appeared on DEV Community and was authored by Victor

I am trying to use form submit and its not being called. This is my code snipped. Not sure what I am doing wrong. Thanks for the help.

Using Vue: 3.4.18
Quasar: 2.16

:sent=”message.from == ‘me’ ? true : false” />

                    <template v-slot:after>
                        <q-btn round dense flat type="button" color="white" icon="send" />
                    </template>
                </q-input>
            </q-form>
        </q-toolbar>
    </q-footer>
</q-page>

import { ref } from ‘vue’;

const messages = ref([
{
text: ‘Hey Jim, how are you?’,
from: ‘me’
},
{
text: ‘Good thanks, Danny! How are you?’,
from: ‘them’
},
{
text: ‘Pretty good!’,
from: ‘me’
}
]);

const newMessage = ref(”);

function onSubmit() {
console.log(‘Sending message:’, newMessage.value);
messages.value.push({
text: newMessage.value,
from: ‘me’
});
newMessage.value = ”;

console.log('Sending message:', newMessage.value);

newMessage.value = '';

};

This content originally appeared on DEV Community and was authored by Victor