I've encountered an issue while trying to implement a Basic Vue script within my Laravel blade template.
The error message I am getting reads:
app.js:32753 [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://v2.vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.
(found in )
Here's the code snippet causing the issue:
@extends('layouts.app')
@section('content')
<div id="foo">
@{{ message }}
</div>
@endsection
@section('javascript')
<script>
new Vue({
el: '#foo',
data: {
message: 'Hello Vue!'
}
})
</script>
@endsection