axios 在Vuetable api-mode中传递响应标头

8tntrjer  于 2022-11-23  发布在  iOS
关注(0)|答案(1)|浏览(136)

我想知道是否有一种方法可以使用api-mode,并且仍然能够传递一个响应头,如授权令牌。
Vuetable使用这个api-url属性,并使用它来发出GET请求。当这种情况发生时,我如何传入响应头?

<vuetable
            ref="vuetable"
            :api-url="apiBase"
            :query-params="makeQueryParams"
            :per-page="perPage"
            pagination-path
            :reactive-api-url="true"
            :fields="fields"
            :row-class="onRowClass"
            @vuetable:pagination-data="onPaginationData"
            @vuetable:cell-rightclicked="rightClicked"
          >

我希望传入一个响应头,如果它是axios,它将这样做。

const response = await axios.get(this.apiBase, {
      headers: { Authorization: `Bearer ${$cookies.get('token')}`}
    })

文档中确实提到可以通过将api-mode设置为false并使用data-mode来实现。我将完全控制api和数据,但这意味着我将牺牲query-params,它使我能够使用库的分页和排序功能。一般来说,如果我使用data-mode而不是api-mode,我会丢失很多vuetable的内置函数,所以我更喜欢使用api-mode
相关文件:https://www.vuetable.com/api/vuetable/properties.html#api-mode

b5lpy0ml

b5lpy0ml1#

我已经在github中找到了这个thread的答案。

<vuetable :http-options="httpOptions" ...

在JS中

export default {
    data() {
        return {
            httpOptions: { headers: { Authorization: 'Bearer ' + TOKEN } },
            ...

相关问题