Question

我想将其用于所有组件和页面以及当前的配置：

〜/ plugins / axios

import axios from 'axios'

export default axios.create({
  baseURL: 'http://127.0.0.1:3001/'
})

但是通过这种方式，我必须在组件和页面中import axios from '~/plugins/axios' 我想用这样的东西来选择：

this.$axios.post('url',data).then(res=>{
// do something in here 
}).catch({
// do something in here 
})

并且无需导入更多axios

Answer 1

我建议您对Nuxt.js使用官方的“ Axios模块”：https://github.com/nuxt-community/axios-module

npm install @nuxtjs/axios

首先，您可以在baseURL或env变量（请参见https://axios.nuxtjs.org/options）中设置nuxt.config.js：

modules: [
  '@nuxtjs/axios'
],
axios: {
  baseURL: 'http://127.0.0.1:3001/' // or, Environment variable API_URL_BROWSER can be used to override browserBaseURL.
}

然后在<page>。vue中，不再导入，将axios注入app var中（请参阅https://axios.nuxtjs.org/usage）：

<script>
export default {
 asyncData ({ app }) {
   app.$axios.$get(`/api/users`).then(
      // do something in here 
    );
    //...
  }
}
</script>

最后，您可以使用自定义插件全局处理错误（请参见https://axios.nuxtjs.org/extend）

$axios.onError(error => {
  // do something in here 
})

共享nuxtjs全局使用axios标准的方法？

1 个答案: