Vue.js 如何根据路由参数动态更改vuejs方法？

我构建了一个可重用组件，用户可以在其中上载图像并将其存储在firebase存储中。问题是，我的组件需要能够使用与正在更新的部分协调的标签来引用数据库中的图像

我的问题是，当我为“downloadURL”命名位置时，我的方法存在问题。在下面的代码中，我创建了变量“picName”，并将其定义为节名，后跟“imgUrl”。但是，当
我在函数中引用picName，它的值成为下载URL

如果我的节名是“welcome”，那么我希望下载的URL保存为数据库中的welcomeimgUrl。对于“about”，应该是aboutimgUrl等

以下是我的方法：

editImage（）{
this.performingRequest=true
让rest=this.restInfo
让section=this.section
让picName=this.section+'imgUrl'
console.log（picName）
如果（此图像）{
this.image.generateBlob(
blob=>{
让我们下载URL
设rand=（Math.random（）.toString（36）.子字符串（2,16）+Math.random（）.toString（36）.子字符串（2,16））.toUpperCase（）
设picRef=fb.storageRef.child（'sectionPics/'+rand）
picRef.put（blob）.then（（snap）=>{
picRef.getDownloadURL（）.then（函数（downloadURL）{
console.log（'File available at'，downloadURL）
设dct2={}
dct2[picName]=下载URL
console.log（dct2）
fb.restCollection.doc（rest.id）.更新({
dct2[picName]：下载URL
})
})
})
设置超时（（）=>{
this.performingRequest=false
this.image.remove（）
}, 2000)
}
)
}否则{
}
}

---

如何根据正在编辑的节的名称更改下载URL的数据库位置？

问题在于更新Firestore文档时的地图创建。使用文字对象表示法编写映射时，键被视为字符串，而与使用相同名称定义的变量无关。相反，您期望的结果是键

picName

变成

picName

值，而不是字符串picName。请参见下面的示例，了解代码方面的解释和修复方法

picName=“foo”
downloadUrl=“bar”
dct1={picName:downloadUrl}
console.log（dct1）/=>{“picName”：“bar”}（键作为字符串）
//解决方案
dct2={}
dct2[picName]=下载URL
console.log（dct2）/=>{“foo”：“bar”}（键作为变量值）

---

编辑：调用firestore update时更改的代码语法不正确。创建hashmap后，应将其直接传递给update方法。请参阅下面的代码：

let dct2 = {}
dct2[picName] = downloadUrl
fb.restCollection.doc(rest.id).update(dct2)

---

谢谢你的帮助。。。我认为你的思路是对的，但还没有完全奏效。我正在将您的代码添加到问题中的方法中。dct2[picName]：下载URL导致意外错误