laravel Vue 组件未显示/更新
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42890072/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Vue Components not showing/updating
提问by Vedran Korponaji?
I am working in Laravel 5.4, and Vue components are not showing/updating. I start a new project and create a route /chat in web.php
我在 Laravel 5.4 中工作，并且 Vue 组件没有显示/更新。我开始一个新项目并在 web.php 中创建一个路由 /chat
This is chat.blade.php
这是chat.blade.php
<!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>
This is app.js
这是 app.js
require('./bootstrap');
Vue.component('example', require('./components/Example.vue'));
Vue.component('chat', require('./components/Chat.vue'));
const app = new Vue({
el: '#app'
});
Example and Chat components are some basic templates, I am not passing any data, just plain text.
Example 和 Chat 组件是一些基本模板，我没有传递任何数据，只是纯文本。
Chat.vue
Chat.vue
<template lang="html">
<div id="content">
<h1>Messages</h1>
<p>Message text</p>
<small>Hiii</small>
</div>
</template>
<script>
export default {
}
</script>
When I run php artisan for the first time, everything works. I try to edit some text in Chat.vue, like change 'Hiiii' to Hello, when I reload the page it won't change, it just stays the same. I tried restarting the pc, running php artisan again, anything I could think of. I tried putting some Vue code directly in chat.blade.php, and than it works. It looks like it is not detecting changes in app.js and components. FYI, I even deleted the Example.vue component. It still appeared on the page.
当我第一次运行 php artisan 时，一切正常。我尝试在 Chat.vue 中编辑一些文本，例如将 'Hiiii' 更改为 Hello，当我重新加载页面时它不会改变，它只是保持不变。我尝试重新启动电脑，再次运行 php artisan，任何我能想到的。我尝试将一些 Vue 代码直接放在 chat.blade.php 中，然后它起作用了。看起来它没有检测 app.js 和组件中的变化。仅供参考，我什至删除了 Example.vue 组件。它仍然出现在页面上。
回答by Jordao Manguena
The best way to solve this problem is to update npm because it will update all the packages and install missing packages, as a result you will have laravel mix compiling your assets; right now you are not able to do so.
解决这个问题的最好方法是更新 npm，因为它会更新所有包并安装丢失的包，结果你将有 laravel mix 编译你的资产；现在你不能这样做。
npm update
For some people an easier solution can work which is to run the watch-polcommand
对于某些人来说，可以使用更简单的解决方案，即运行watch-pol命令
npm run watch-poll
回答by wafutech
Have you tried to clear browser cache? This should solve the problem.
您是否尝试过清除浏览器缓存？这应该可以解决问题。
回答by Othmane
copy this code in app.blade.php :
将此代码复制到 app.blade.php 中：
const app = new Vue({
el: '#app'
});
