在 vue.js 中使用帶有 url 常數的變數

Question

我正在嘗試讓我的 vue 應用程式發揮作用

我製作了constants.js文件，在其中我只是聲明了一些我打算回收的URL，而不是每次都重寫它們，但其中一些需要東西的ID

#Example of constant definined in constants.js
export const useVariables = `https://myapiserver.com/iNeedVar1Here/${var1}/iNeedVar2here/${var2}`

現在我想在我的 vue 應用程式中使用這個常數，並在發送實際請求之前將變數傳遞到需要的地方

getItem() {
            let var2 = this.formValues.item2;
            let var1 = this.formValues.item1;
            if (item != null) {
                axios.get(useVariables)
                    .then((res) => {
                        console.log(res.data)
                    })
                    .catch(err => console.log(err));
            }
            else {
                alert('Select an item before preceding')
            }

Answer 1

你的常數是靜態的，它不像計算屬性或任何東西，它只是一個普通的字串，所以它不起作用。相反，您可以建立一個函數來建立並傳回 URL，如下所示：

export const useVariables = (var1, var2) => `https://myapiserver.com/iNeedVar1Here/${var1}/iNeedVar2here/${var2}`

然後你可以像這樣建立常數：

getItem() {
  let var2 = this.formValues.item2;
  let var1 = this.formValues.item1;
  if (item != null) {
    axios.get(useVariables(var1, var2))
      .then((res) => {
        console.log(res.data)
      })
      .catch(err => console.log(err));
  } else {
    alert('Select an item before preceding')
  }
}