私はLaravel 5.4で作業していますが、Vueコンポーネントは表示/更新されません。 は、私は新しいプロジェクトを開始し、これがapp.jsVueコンポーネントが表示/更新されない
require('./bootstrap');
Vue.component('example', require('./components/Example.vue'));
Vue.component('chat', require('./components/Chat.vue'));
const app = new Vue({
el: '#app'
});
例である
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="css/app.css">
</head>
<body>
<div id="app">
<example></example>
<chat></chat>
</div>
<script type="text/javascript">
window.Laravel = { csrfToken: '{{ csrf_token() }}' };
</script>
<script src="js/app.js"></script>
</body>
</html>
これはchat.blade.phpあるweb.phpでチャット/ルートを作成し、コンポーネントをチャットいくつかの基本的なテンプレートですが、私はデータを渡すのではなく、平易なテキストだけです。
Chat.vue
<template lang="html">
<div id="content">
<h1>Messages</h1>
<p>Message text</p>
<small>Hiii</small>
</div>
</template>
<script>
export default {
}
</script>
私が初めてPHPの職人を実行すると、すべてが動作します。 Chat.vue内のテキストを編集しようとしました.Hiiiに変更したように、私はページをリロードしても変更されません。同じままです。私は、私は考えることができる何か、再び、PHPの職人を実行して、PCを再起動しようとしました。 私はchat.blade.phpに直接いくつかのVueコードを入れてみました。 app.jsとコンポーネントの変更を検出していないようです。 参考までに、私はExample.vueコンポーネントも削除しました。まだページに表示されています。
私はLaravelが何をしているのか、どのようにコンパイルするのか分かりませんが、PHPの職人がJavascriptを処理しないと思います。 編集ファイルの後に 'npm run dev'を実行しようとしましたか? –
'npm run watch 'を使って、ファイルを変更時に再コンパイルして、それ以降のすべての要求の初期オーバーヘッドを節約することもできます。 –
これは今、うまく動作します! –