Laravel 5.4 및 Vue 2.0.1 정의되지 않은 'get'속성을 읽을 수 없습니다.

Question

새 Laravel 5.4에서 Vue 템플릿을 사용하고 있습니다. 내 있음 Office.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">Example Component</div> 

        <div class="panel-body"> 
         I'm an example component! {{ message}} | {{ type}} | {{ number }} 
        </div> 
        <span id="vue"></span> 
       </div> 
      </div> 
     </div> 
    </div> 
</template> 

<script> 
    export default { 
     mounted() { 
      return this.displayOffices(); 
     }, 
     data: function(){ 
      return { 
       message: "aw", 
       type: "test", 
       number: 2 
      } 
     }, 
     methods: { 
      displayOffices: function(){ 
       this.$http.get('/vueOffice', function(course) { 
        console.log(course); 
       }); 
      } 
     } 
    } 
</script> 

일 좋은 잘하지만 난 이에

Uncaught TypeError: Cannot read property 'get' of undefined

에 오류가 발생했습니다. 내가 달성 노력하고있어 $ http.get

입니다 해당 경로에서 JSON 데이터를 반환하는 데이터를 가져옵니다.

나는이 오류를 수정하는 데 도움이 필요합니다. 답변을 찾으려고했지만 Vuejs를 구현하는 데있어 다른 방법을 가진 모든 사람이 필요합니다.

Answer 1

하면 다음 axios으로 this.$http 교체 axios 대신 vue-resource의를 사용하는 경우.

Answer 2

당신이 this.$http.get

를 사용하거나이 axios를 설치하고 대신이를 사용하지 않는 것이 좋습니다 this.$http.get

Answer 3

의 axios.get를 사용하기 전에 vue-resource을 설치해야합니다. $ http.get는 뷰를 제공하려고합니다 그것을지지하지 말라. 그들은 axios를 사용하여 라이브러리를 사용하는 것이 좋습니다. 그런 다음 this.axios.get()을 사용할 수 있습니다.

self.axios 
    .get(apiUrl, { 
    params: this.formData, 
    }) 
    .then((response) => { 

    }); 

Answer 4

또 다른 방법은 파일에 다음 코드를 추가하는 것입니다

Vue.prototype.$http = axios; 

Answer 5

이 파일이require('vue-resource'); 추가


/resources/assets/js/bootstrap.js

후 :

window.Vue = require('vue');