爲什麼在瀏覽器中不顯示任何內容？（vue.js 2）

我從這裏得到：https://github.com/JellyBool/laravel-vue-pagination 爲什麼在瀏覽器中不顯示任何內容？（vue.js 2）

然後，我克隆它，我嘗試在我的本地

但是，它執行後，在瀏覽器中不顯示任何

<!DOCTYPE html> 
    <html> 
    <head> 
     <title>Laravel</title> 
     <link rel="stylesheet" 
       href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
    </head> 
    <body> 
    <div class="container"> 
     <div class="col-md-8 col-md-offset-2"> 
      <div id="app"> 
       <ul class="list-group"> 
        <li class="list-group-item" v-for="item in items"> 
         <a href="/item/@{{ item.id }}"> 
          @{{ item.title }} 
         </a> 
        </li> 
       </ul> 
       <nav> 
        <ul class="pagination"> 
         <li v-if="pagination.current_page > 1"> 
          <a href="#" aria-label="Previous" 
           @click.prevent="changePage(pagination.current_page - 1)"> 
           <span aria-hidden="true">&laquo;</span> 
          </a> 
         </li> 
         <li v-for="page in pagesNumber" 
          v-bind:class="[ page == isActived ? 'active' : '']"> 
          <a href="#" 
           @click.prevent="changePage(page)">@{{ page }}</a> 
         </li> 
         <li v-if="pagination.current_page < pagination.last_page"> 
          <a href="#" aria-label="Next" 
           @click.prevent="changePage(pagination.current_page + 1)"> 
           <span aria-hidden="true">&raquo;</span> 
          </a> 
         </li> 
        </ul> 
       </nav> 
      </div> 

     </div> 
    </div> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.10/vue.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.2.0/vue-resource.min.js"></script> 
    <script> 
     new Vue({ 
      el: '#app', 
      data: { 
       pagination: { 
        total: 0, 
        per_page: 7, 
        from: 1, 
        to: 0, 
        current_page: 1 
       }, 
       offset: 4,// left and right padding from the pagination <span>,just change it to see effects 
       items: [] 
      }, 
      ready: function() { 
       this.fetchItems(this.pagination.current_page); 
      }, 
      computed: { 
       isActived: function() { 
        return this.pagination.current_page; 
       }, 
       pagesNumber: function() { 
        if (!this.pagination.to) { 
         return []; 
        } 
        var from = this.pagination.current_page - this.offset; 
        if (from < 1) { 
         from = 1; 
        } 
        var to = from + (this.offset * 2); 
        if (to >= this.pagination.last_page) { 
         to = this.pagination.last_page; 
        } 
        var pagesArray = []; 
        while (from <= to) { 
         pagesArray.push(from); 
         from++; 
        } 

        return pagesArray; 
       } 
      }, 
      methods: { 
       fetchItems: function (page) { 
        var data = {page: page}; 
        this.$http.get('api/items', data).then(function (response) { 
         //look into the routes file and format your response 
         this.$set('items', response.data.data.data); 
         this.$set('pagination', response.data.pagination); 
        }, function (error) { 
         // handle error 
        }); 
       }, 
       changePage: function (page) { 
        this.pagination.current_page = page; 
        this.fetchItems(page); 
       } 
      } 
     }); 
    </script> 
    </body> 
    </html>

我怎樣才能解決這個問題：在\resources\views\welcome.blade.php這樣

我編輯的代碼？

來源

2017-02-11 moses toh

在哪裏這些文件？您需要創建的js文件夾中當前目錄（內視圖文件夾），然後從互聯網上獲得VUE和VUE-resource.min腳本。複製它們並保存在文件中。或者你可以包含這些腳本的鏈接。

<script src="https://unpkg.com/vue/dist/vue.js"></script> 
<script src="https://cdn.jsdelivr.net/vue.resource/1.0.3/vue-resource.min.js"></script>

來源

2017-02-11 09:53:02

我不得不改變它。所以，我使用cdn vue。沒有錯誤。但在瀏覽器中不顯示任何 –

見我的問題。我不得不更新 –

你通過安裝所有依賴條件「作曲家安裝」命令，然後建立數據庫？所有必要的步驟都列在您提供的github鏈接的使用部分中。你做得對嗎？正如我所建議的，你甚至不需要包含鏈接。 –

爲什麼在瀏覽器中不顯示任何內容？ （vue.js 2）

回答

相關問題

爲什麼在瀏覽器中不顯示任何內容？（vue.js 2）