2017-02-23 149 views
-1

我被這個代碼填塞了。我不能讓它工作,我不會有任何錯誤。這可能意味着我需要一個依賴關係?它根本不顯示。請幫幫我。謝謝。Laravel Vue組件未顯示

app.js - 文件

Vue.component('message', require('./components/Message.vue')); 

const app = new Vue({ 
    el: '#app' 
}); 

Message.vue - 文件

<template> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-md-8 col-md-offset-2"> 
       <div class="panel panel-default"> 
        <div class="panel-heading">Message</div> 
        <div class="panel-body"> 
         I'm the component! 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</template> 

<script> 
    export default { 
     ready() { 
      console.log('Component ready') 
     } 
    } 
</script> 

home.blade.php - 文件

@extends('templates.default') 

@section('content') 
    <h3>Welcome to Site</h3> 
    <div class="container"> 
     <div id="app"> 
      <message></message> 
     </div> 
    </div> 
@stop 
+0

你有VUE開發工具?您可以檢查是否已創建根實例。另外,如果您使用vue 2,'ready'方法已折舊,則應使用'mounted'或其他生命週期方法。 –

+0

我將如何使用作曲家更新vue js到2? – Castiel

+0

我有Vue 2.1.0,但仍然沒有顯示任何東西。請幫忙。 – Castiel

回答

1

您可能還需要清除瀏覽器緩存當與前端一起工作時。在mac上這是command + shift + R。還要確保你運行了gulp來編譯你的js文件。

還請確保您已經編譯js文件到您的佈局模板</body>前:

<script src="/js/app.js"></script>