小编pio*_*otr的帖子

我已经开始使用单文件组件与Laravel构建vue.js应用程序.问题出在我的app对象上:它是一个DOM,而不是Vue对象,应用程序无法正常工作.

当我启动我的应用程序时,组件正确呈现,vue-devtools识别Vue 2.2.6,evertything似乎以正确的方式工作.

但是当我打字的时候

console.log(app)

在chrome控制台中我看到一个DOM对象:

<div id="app"></div>

更何况,当我尝试hello通过键入更改标题属性(并希望在屏幕上看到更改的组件)

app.title = "awesomness"

在控制台中,我的组件不会改变,但只有我的div#app:(键入console.log(app)

<div id="app" title="awesomness"></div>

问题是:为什么？以下样本.

测试组件 Hello.vue

<template>
    <div>
        <p>{{ greeting }} World!</p>
    </div>

<script>
    module.exports = {
        props: ['greeting'],
        data: function() {
            return {
            }
        }
    }
</script>

<style scoped>
    p {
        color: red;
        font-size: 20px;
    }
</style>

laravel的索引/索引视图的一部分:

<div id="app">
    <hello :greeting="title"></hello>
</div>

最后是我的/resources/assets/js/app.js档案

import Vue from 'vue'
import Hello from './components/Hello.vue'

Vue.component('hello', Hello);

var …

我创建了与之相关的News模型NewsObserver.我想对传递给updated/ on updating事件的模型传递新旧数据做一些逻辑,但传递模型的转储与原始属性具有相同的属性,除了'updated_at' 字段.我究竟做错了什么？

public function updating(News $item)
{
    dd($item);
}

这是观察者所附的地方

use App\Observers\NewsObserver;
use App\Observers\FileObserver;

class AppServiceProvider extends ServiceProvider
{
/**
 * Bootstrap any application services.
 *
 * @return void
 */
public function boot()
{
    News::observe(NewsObserver::class);
    File::observe(FileObserver::class);
}

这是我NewsObserver参加updating活动的一部分.dd中$item只包含旧数据

namespace App\Observers;
use App\News;

class NewsObserver
{
/**
 * Listen to the News updated event.
 *
 * @param  \App\News $item
 * @return void
 */ …