[Vue warn]: Property or method "message" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/

Posted 11 months ago by [email protected]

Hello there i am getting this error:

`[Vue warn]: Property or method "message" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

(found in <Root>)` 

my component code is this one:

<template>
</template>

<script>
    export default {
        data() {
            return {
                message: 'dsdsds',
            };
        },
        mounted() {
            console.log('Upload component', this.message);
        }
    }
</script>

i am loading the component from app:
Vue.component('upload-component', require('./components/Upload.vue'));
Vue.component('products-component', require('./components/Products.vue').default);

const app = new Vue({
    el: '#app'
});

also i have run - npm run watch

and my blade module i have this code:

<div class="form-group">
                            <label for="name">Name</label>
                            <input type="text" class="form-control" :model="message" id="name" name="name" aria-describedby="emailHelp" placeholder="Title" value="{{ old('name') }}" required>
                        </div>

Please sign in or create an account to participate in this conversation.