2017-06-22 52 views
1

我是Vuejs 2的新手,目前正在执行一个项目。我正在使用vuetable-2Vuejs 2中形成数据表。无法检索使用vuetable-2的数据,在Vuejs 2

我目前正面临一个问题,我无法使用属性,api-url,vuetable-2检索数据。

但是,我可以使用Axios和Global Axios Default Configs (将令牌传递给每个请求标头)从服务器检索数据。


Error Image

以上示出了该图像2个部分:
1.使用vuetable-2的API-URL [该一个与错误403,禁止]
2.使用Axios的GET请求[成功地检索数据]


Vuetable-2 API-URL(API调用服务器):

<vuetable 
    ref="vuetable" 
    api-url="http://localhost:3000/api/staffs" 
    :http-options = "httpOptions" 
    :load-on-start = "loadOnStart" 
    :fields="['userId', 'name', 'username']" 
    ></vuetable> 

爱可信全球默认配置:

// Global axios default (config default that will be applied to every request) 
var accessToken = window.localStorage.getItem('access_token') 
axios.defaults.baseURL = 'http://localhost:3000/' 
axios.defaults.headers.common['x-access-token'] = accessToken 

上午我上遗漏了呢? : -/

回答

-1

从vuetable的源代码http://cdn.jsdelivr.net/vue.table/1.5.3/vue-table.js (你可以搜索键workd“loadData”找到的地方。)

,我们可以知道,它是使用this.$http.get(url, this.httpData, this.httpOptions).then(function (response) { 从服务器检索数据。

所以我只敢说你为axios配置的头文件不适用于vuetable,你能检查由vuetable发送的请求头文件的内容吗?

我的意思是http://localhost:3000/api/staffs?sort=&XXX

+0

也许你可以参考这个问题补充拦截您vuetable的要求https://stackoverflow.com/questions/39665244/vue-resource-interceptor-for-auth-headers –