I have my chat and I dont want people to send empty message so I would like that my input become required. Thanks for your help.

I tried to put required='required' in the input line, I also tried veeValidate but it broke my chat when I use it, I also tried to put Required = true in Props and data but without a good result

This is ChatForm.vue

<template>

    <div class=input-group >

        <input id=btn-input type=text name=message  class=form-control input-sm placeholder=Ecrire... v-model=newMessage @keyup.enter=sendMessage>



        <span class=input-group-btn>

            <button class=btn btn-primary btn-sm  id=btn-chat @click=sendMessage>

                &#10003

            </button>

        </span>

    </div>

</template>



<script>





    export default {

        props: ['user'],



        data() {

            return {

                newMessage: '',

            }

        },



        methods: {

            sendMessage() {

                this.$emit('messagesent', {

                    user: this.user,

                    message: this.newMessage

                });



                setTimeout(function() {

                    const messages = document.getElementById('mess_cont');



                    messages.scrollTop = messages.scrollHeight;

                    }, 200);

                this.newMessage = '';



            }



        }

    }





</script>

And this is my form in the app.blade.php

  <div id=app class=container-chat>



                    <div class=row>

                        <div class=col-md-12 col-md-offset-2>

                            <div class=col-md-12 col-md-offset-2>

                                <div class=panel-body panel-content id=mess_cont>



                                    <chat-messages id=mess :messages=messages :currentuserid={{Auth::user()->id}}></chat-messages>

                                </div>

                                <div class=panel-footer>

                                    <chat-form

                                            v-on:messagesent=addMessage

                                            :user={{ Auth::user() }}

                                    ></chat-form>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>