在 axios VueJS 中传递当前域的 url答案

【问题标题】：Pass the url of the current domain in axios VueJS在 axios VueJS 中传递当前域的 url
【发布时间】：2018-12-03 13:44:24
【问题描述】：

我正在尝试将我要在 axios 中传递的域的 url 传递给它。这是我目前的硬网址：

import axios from 'axios';

export default {
    name: 'cart',
    components: {},
    data() {
        return {
            cart: '',
            timer: '',
            baseUrl: 'http://prestashop_1_6.local/modules/analyticsvuejs/php/cart.php',
        }
    },
    methods: {
        getCarts() {
            axios
                .get(this.baseUrl, {
                    params: {
                        action: 'cart'
                    }
                })
                .then(response => {
                        this.cart = response.data;
                        console.log(this.cart);
                    }, (error) => {
                        console.log(error);
                    }
                )
        },
    },
    created() {
        this.getCarts();
        this.timer = setInterval(this.getCarts, 5000)
    },
}

我正在尝试创建一个变量以将其动态传递给我的所有组件

我希望用动态变量替换“http://prestashop_1_6.local/”。

感谢您的帮助。

【问题讨论】：

http://prestashop_1_6.local 是您当前正在浏览的站点的域吗？如果是这样，您可以完全省略该部分，并将其余部分用作基本 url。无论如何，当域相同时，它是首选。它使您的代码无需修改即可从开发环境转移到生产环境。
是的，即使我在这个 URL 上，我也必须强制调用这个 URL，因为它特别调用了一个模块
所以，我建议的一件事是让你的 baseUrl 简单地成为'/modules/analyticsvuejs/php/cart.php'。浏览器将使用您当前所在的相同协议/域 (http://prestashop_1_6.local)，但现在如果您从不同域发出此请求，它会自动正常工作。当您部署到生产或任何东西时，无需更改baseUrl。现在，如果您需要在多个 Vue 文件中使用 /modules/analyticsvuejs/php/cart.php 部分，那么请考虑像 @AfikDeri 所说的那样将其放入不同的文件中。

标签： vue.js axios

【解决方案1】：

1) 使用包含此基本 url 的 const 创建一个单独的文件。

2) 导出这个常量

3) 随时随地使用它

// consts.js

export const BASE_URL = 'http://prestashop_1_6.local';


// Any file that consume it.
import {BASE_URL} from './consts';

data() {
  return {
    url: `${BASE_URL}/something/something-else`
  };
}

【讨论】：

是否可以动态恢复值以将其放入常量中？ export const BASE_URL = my_variable_here;