Verwendung von Variablen mit URL-Konstanten in vue.js

Question

Ich versuche, meine Vue-App zum Laufen zu bringen

Ich habe eine Datei „constants.js“ erstellt, in der ich nur einige URLs deklariert habe, die ich recyceln wollte, anstatt sie jedes Mal neu zu schreiben, aber einige von ihnen brauchten IDs von Dingen

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

Jetzt möchte ich diese Konstante in meiner Vue-Anwendung verwenden und die Variable an der benötigten Stelle übergeben, bevor ich die eigentliche Anfrage sende

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')
  }
}