VueJS Reactive Model Not visable

I am following this tutorial and have copied the code shown as below. When putting v-model in it just isn't displayed.

https://www.youtube.com/watch?v=sojqhdVOKCc&list=PL3VM-unCzF8jeu0m8pSz6-Q9TwV74AbvW&index=19&ab_channel=Laracasts

<template>
    <Head title="Create User" />

    <h1 class="text-3xl">Create New User</h1>

    <form action="/" method="post" class="max-w-md mx-auto mt-6">
        <div class="mb-6">
            <label class="block mb-2 uppercase font-bold text-xs text-gray-700" for="name">
                Name
            </label>

            <input 
                v-model="form.name" 
                class="border border-gray-400 p-2 w-full" 
                type="text" 
                name="name" 
                id="name" 
                required>
        </div>

        <div class="mb-6">
            <label class="block mb-2 uppercase font-bold text-xs text-gray-700" for="email">
                Email
            </label>

            <input 
                class="border border-gray-400 p-2 w-full" 
                type="email" 
                name="email" 
                id="email" 
                required>
        </div>

        <div class="mb-6">
            <label class="block mb-2 uppercase font-bold text-xs text-gray-700" for="password">
                Password
            </label>

            <input  
                class="border border-gray-400 p-2 w-full" 
                type="password" 
                name="password" 
                id="password" 
                required>
        </div>

        <div class="mb-6">
            <button type="submit" class="bg-blue-400 text-white rounded py-2 px-2 hover:bg-blue-500 w-full">Submit</button>
        </div>
    </form>

</template>

<script export>
    import { reactive } from "vue"

    let form = reactive({
        name: '',
        email: '',
        password: '',
    });
</script>

Randy_Johnson

3 years ago

Best Answer

Level 8

<script setup> - Sorry guys, stupid mistake.

Please or to participate in this conversation.