2017-08-25 17 views
7

मैं एक पृष्ठांकन घटक Vue 1 के साथ बनाया गया है, जिसके लिए मैं Laravel पृष्ठांकन से डेटा प्राप्त कर रहा हूँ नहीं है: के बाद मैं अपने क्रोम अद्यतन किया है, किसी कारण सेVue संसाधनों - plugin.apply एक समारोह

<template> 
    <div class="row"> 
     <div class="col-md-8"> 
      <div v-if="zeroVideos">No videos found for "{{ query }}""</div> 
     </div> 
     <div class="col-md-8"> 
      <single-video v-for="video in videos" :video="video"></single-video> 
     </div> 
    </div> 
    <div class="row justify-content-center"> 
     <pages v-if="meta && videos.length && showPagination" for="videos" :pagination="meta.pagination"></pages> 
    </div> 
</template> 

<script> 
    import eventHub from '../events.js' 

    export default { 
     props: ['query'], 
     data() { 
      return { 
       videos: [], 
       meta: null, 
       showPagination: false, 
       zeroVideos: false, 
      } 
     }, 
     methods: { 
      getVideos (page) { 
       this.$http.get('/search/videos?q=' + this.query + '&page=' + page).then((response) => { 
        this.videos = response.data.data 
        this.meta = response.data.meta 
        this.showPagination = response.data.meta.pagination.total_pages > 1 
        console.log('Videos ' + response.data.meta.pagination.total) 
        this.zeroVideos = response.data.meta.pagination.total < 1 
        eventHub.$emit('videos.counter', response.data.meta.pagination.total) 
       }) 
      } 
     }, 
     ready() { 
      this.getVideos(1) 
      eventHub.$on('videos.switched-page', this.getVideos) 
     } 
    } 
</script> 

, पृष्ठांकन बंद कर दिया काम कर रहा है और मैं response.data.meta के लिए अपरिभाषित हो रही है, लेकिन कंसोल में नेटवर्क टैब की जाँच पर, मैं बैकएंड से डेटा भेज रहा हूँ:

data[{id: 43, uid: "15883245ef3de1",…}, {id: 44, uid: "15883245ef3de2",…},…] 
meta:{pagination: {total: 8, count: 8, per_page: 20, current_page: 1, total_pages: 1, links: []}} 

पृष्ठांकन IE, Firefox और Safari पर ठीक काम करता है, लेकिन क्रोम पर मुझे अद्यतन करने के बाद समस्याएं हैं I थोड़ा सा जांच करने के बाद मुझे एहसास हुआ कि यह वू संसाधनों के साथ समस्या है, क्योंकि अगर मैं वेनिला जेएस के साथ अनुरोध प्राप्त करता हूं, तो मुझे प्रतिक्रिया डेटा मिलता है, लेकिन मैं वू संसाधनों का उपयोग करना चाहता हूं, क्योंकि मैं इसे कुछ छोड़ने में उपयोग कर रहा हूं अवयव। मैं 0.9.3 Vue संसाधनों संस्करण है, और क्योंकि जाहिरा तौर पर बग नए संस्करण में तय हो गई है मैं, इसे अद्यतन करने की कोशिश की है, लेकिन मैं त्रुटि मिली इसे अपडेट करने पर:

plugin.apply is not a function

मैं बदलने की कोशिश की है जिस तरह से मैं से प्लगइन आयात करते हैं, यहाँ का सुझाव दिया:

var VueResource = require('vue-resource'); 
Vue.use(VueResource); 

Vue.use(require('vue-resource')); 

लिए लेकिन, अब भी वही त्रुटि, मैं कैसे Vue संसाधनों के साथ इस मुद्दों को ठीक कर सकते हैं?

उत्तर

0

vue-resource कुछ समस्याएं हैं और इसे अद्यतन और रखरखाव बंद कर दिया गया है। इसके लेखक ने axios को vue-resource को प्रतिस्थापित करने के लिए लिखा है। इसलिए, मैं आपको axios का उपयोग करने की सलाह देता हूं। axios

:

आप npm या yarn द्वारा axios स्थापित करने और साथ var axios = require('axios'); Vue.prototype.$http = axios

संदर्भ var VueResource = require('vue-resource'); Vue.use(VueResource); प्रतिस्थापित करने की आवश्यकता