arrays - 无法在 Vue 中响应实例

Question

我在 laravel 框架中使用 Vue.js。

我已经成功声明了一个new Vue，但是当我尝试渲染数据时，它运行错误：

[Vue 警告]：属性或方法“消息”未在实例上定义，但在渲染期间被引用。通过初始化该属性，确保该属性是反应性的，无论是在数据选项中，还是对于基于类的组件。

我试图解决这个问题但失败了，希望有人能帮助我。这是我的代码。

你好.blade.php

@extends('frontend.layouts.app')

@section('content')
<link href="{{ asset('css/hello/hello.css') }}" 
<div id="helloApp">
  <p>@{{message}}</p>
</div>
@endsection
<script src="{{ asset('js/hello/hello.js') }}"></script>

你好.js

window.onload = function() {
    new Vue({
        el: '#helloApp',
        data() {
            return {
                message: 'test',
            }
        }
    })
}

标签： arrayslaravelvue.jsinstance