Vuejs 2에서 vuetable-2를 사용하여 데이터를 검색할 수 없습니다.

Vuejs 2에서 vuetable-2를 사용하여 데이터를 검색할 수 없습니다.

저는 Vuejs 2에 처음 와서 프로젝트를 진행 중입니다.Vuejs 2에서 데이터 테이블을 만들기 위해 vuetable-2를 사용하고 있습니다.

현재 api-url, vuetable-2 속성을 사용하여 데이터를 검색할 수 없는 문제에 직면해 있습니다.

단, Axios와 Global Axios Default Configs를 사용하여 서버에서 데이터를 가져올 수 있습니다(모든 요청 헤더에 토큰을 전달).

---

에러 이미지

위의 그림은 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>

Axios 글로벌 디폴트 설정:

// 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

내가 놓친게 있나요? :-/

요청을 푸시할 때 Axios 헤더가 Vuetable에 의해 덮어쓰기되었을 뿐입니다.다음 형식을 사용하여 vueTable에 제공할 수 있습니다.

  <vuetable
    ref="vuetable"
    api-url="http://localhost:3000/api/staffs"
    :http-options="{ headers: { 'x-access-token' : accessToken } }"
    :load-on-start = "loadOnStart"
    :fields="['userId', 'name', 'username']"
  ></vuetable>

(주요 workd 'loadData'를 검색하여 장소를 찾을 수 있습니다.)

우리는 그것이 사용하고 있다는 것을 알 수 있다.this.$http.get(url, this.httpData, this.httpOptions).then(function (response) {서버에서 데이터를 가져옵니다.

그래서 당신이 axi용으로 설정한 헤더는 vuetable로 동작하지 않는다고 생각합니다만, vuetable로 송신된 request header의 내용을 확인해 주실 수 있습니까?

제 말은.http://localhost:3000/api/staffs?sort=&XXX

언급URL : https://stackoverflow.com/questions/44706285/unable-to-retrieve-data-from-using-vuetable-2-in-vuejs-2