L

Table of Contents

    et's quickly create a Notification component that will be used to display success and error messages across the app. Within the components folder, create a Notification.vue file and paste the code below into it:

    // src/components/Notification.vue
    
    <template>
        <div class="ui message" :class="type">
            {{ message }}
        </div>
    </template>
    
    <script>
        export default {
            name: 'Notification',
            props: {
                message: {
                    type: String,
                    required: true,
                },
                type: {
                    type: String,
                    required: true,
                },
            },
        };
    </script>

    This is a very basic component. It accepts two props (message and type). message is the notification message while type is the notification type which can be either success or error.

    Chimezie Enyinnaya

    16 posts

    Software Developer [PHP Laravel JavaScript NodeJS AdonisJS VueJS] | movie lover | run http://openlaravel.com