Question

我有一个名为urlMixin.js的JS文件。

urlMixin.js

export function serverUrl() {
    return 'http://localhost:3000';
}

我有一个名为Login.vue的Vue文件。我可以通过导入它来在Vue文件中使用urlMixin.js文件。

Login.vue

import {serverUrl} from "./../mixins/urlMixin.js";
    
let url = serverUrl();

export default {

  data() {
    return {
      username: '',
      password: ''
    };
  },
  
  created(){
    axios.post(`${url}/login`)
    .then(resposne =>{
     
     })
     .catch(error =>{
     
     })
  }
}

有一个html文件，index.html，我想在其中使用urlMixin.js中的URL。

的index.html

<head>
<head>
<body>
  <script src="/src/js/App.js"></script>
  <script src="/src/mixins/urlMixin.js"></script>
  
  <script>
        $(document).ready(function() {
           
           App.init();
           var serverURL; 
           
        });
    </script>
</body>

我想将相同的URL导入index.html文件，以便我可以使用urlMixin.js文件返回的字符串并将其分配给变量serverURL。我怎样才能做到这一点？有人可以帮助我吗？

Answer 1

使用axios.create函数你可以给base-url param并将axios全局导入为vue插件

Answer 2

我在main.js文件中创建了axios全局。根据文档，可以指定将应用于每个请求的配置默认值。

import Vue from 'vue'

import router from './routes'

import axios from 'axios';

axios.defaults.baseURL = 'http://localhost:3000';

window.axios = axios;

new Vue({
    el: '#app',
    router
})

如何在Vue文件和HTML文件中使用相同的javascript文件？

2 个答案: