Vue.js/Algolia - Отладка

Question

Ищет помощь, отлаживая код, на который я смотрел в течение 3 дней. Это Vue.js/Laravel/Algolia. Я чувствую, что где-то в моей модели есть ошибка, но я не вижу, чтобы она срабатывала. Какие-либо предложения? Заранее спасибо .:

<input type="text" v-model="name" v-on:keyup="search" debounce="500"> 
<div id="results"> 
    <article v-for="user in users"> 
     <h2>@{{ user.name }}</h2> 
    </article> 
</div> 

и:

new Vue({ 

     el: '#results', 

     data: { 

       query: '', 
       users: [] 

    }, 

     ready: function() { 

       this.client = algoliasearch('myKey', 'myKey'); 
       this.index = this.client.initIndex('getstarted_actors'); 



     }, 


     methods: { 

      search: function() { 

       this.index.search(this.query, function(error, results) { 

        this.users = results.hits; 

     }.bind(this)); 

      } 

     } 

    }); 

Answer 1

Я не знаю, если это ошибка, вы получаете, но:
Ваш v-модель выходит за рамки вашего vue.
Попробуйте поставить его внутри #results DIV:

<div id="results"> 
    <input type="text" v-model="name" v-on:keyup="search" debounce="500" /> 
    <article v-for="user in users"> 
     <h2>@{{ user.name }}</h2> 
    </article> 
</div> 

редактировать данные в вашем вю например

data: { 

     query: '', 
     users: [], 
     name: '' 

} 

Answer 2

Небольшой совет на будущее. Чтобы отладить в Vue.js, я предлагаю вам использовать расширение chrome.

Это позволит видеть предупреждения, ошибки, а также проверять ваши компоненты.

Он будет работать только с неминифицированными версиями Vue.js.

https://github.com/vuejs/vue-devtools