better dev template for ajax

dev.html

@@ -35,7 +35,7 @@
         <v-select placeholder="multiple, taggable" multiple taggable :options="options" no-drop></v-select>
         <v-select placeholder="multiple, taggable, push-tags" multiple push-tags taggable :options="[{label: 'Foo', value: 'foo'}]"></v-select>
         <v-select placeholder="unsearchable" :options="options" :searchable="false"></v-select>
-        <v-select placeholder="loading" loading></v-select>
+        <v-select placeholder="search github.." label="full_name" @search="search" :options="ajaxRes"></v-select>
     </div>
 </body>
 

src/dev.js

@@ -1,6 +1,10 @@
 import Vue from 'vue'
 import vSelect from './components/Select.vue'
 import countries from 'docs/data/advanced.js'
+import debounce from 'lodash/debounce'
+import resource from 'vue-resource'
+
+Vue.use(resource)
 
 Vue.component('v-select', vSelect)
 
@@ -12,6 +16,19 @@ new Vue({
   data: {
     placeholder: "placeholder",
     value: null,
-    options: countries
+    options: countries,
+    ajaxRes: []
+  },
+  methods: {
+    search(search, loading) {
+      loading(true)
+      this.getRepositories(search, loading, this)
+    },
+    getRepositories: debounce((search, loading, vm) => {
+      vm.$http.get(`https://api.github.com/search/repositories?q=${search}`).then(res => {
+        vm.ajaxRes = res.data.items
+        loading(false)
+      })
+    }, 250)
   }
 })