[Vuejs]-VueJs2 using stores with components

by

0👍

I think that you should use vue-resource. (Two reasons: no jQuery, designed for vue).
In my application, I also use vuex which you don’t need I guess however the vue-resource would look like this.

in bootstrap.js required by app.js (alternative for main.js) I have:

window.Vue = require('vue')
require('vue-resource')

point: require of vue-resource adds http into Vue (js is so random)

Vue.http.options.root = '//localhost:8000/api/v1'

Then in api/devices.js there is:

export function getDevices() {
  Vue.http.get('devices').then(response => {
    console.log(response)
  }, response => {
    console.log(response.status)
  })
}

*Keep an eye on the url slashes because vue-resource will use the root only when you don’t write slash before the relative one and also not after root.

Finally in app.js (main.js) there will be something like that:

require('./bootstrap')

import http from 'vue'
import * as api from 'api/devices'

Vue.config.devtools = true
Vue.config.silent = false

new Vue({
  api,
  http,
  el: '#app',
  created() {
    console.log(this.api.getDevices())
  }
})

In child components you would access api as this.$api

Maybe I wrote something wrong. This is just an example of how it works. I am not a vue pro …yet 😀 Good luck. Btw, if you decide for vue-resource, check their examples coz I’ve shown you only the console.logs

Leave a comment