0
我想使用for循環引用firebase數據庫的子節點。我正在使用Vue和Vue-fire。問題是在以下代碼中,categories[addItem.category]
未引用正確的數據。如何在我的firebase子節點中引用數據?
<el-select v-model="addItem.category" placeholder="Select a category." id="category-select">
<el-option
v-for="(val, key) in categories"
:key="val['.key']"
:label="val['.key']"
:value="val['.key']">
</el-option>
</el-select>
<el-button @click="showAdd=true">new category</el-button>
<el-select v-model="addItem.subcategory" placeholder="Select a subcategory." id="subcategory-select" v-show="addItem.category!=''">
<el-option
v-for="subcat in categories[addItem.category]"
:key="subcat['.key']"
:label="subcat['.key']"
:value="subcat">
</el-option>
</el-select>
<el-button v-show="addItem.category!=''" @click="showAdd=true">add subcategory</el-button>
我想獲得所選類別的所有鍵,如果選擇'mechanical',應該給'機械'。目前,選擇「機械」使得categories[addItem.category]
等於undefined
。下面是數據的模樣在我的數據庫: [1]
誰能告訴我爲什麼我的火力參考categories[addItem.category]
未引用子值[在這裏輸入的形象描述] [1]!]?
如果有幫助,這是我如何保存數據:
methods: {
add(){
var updates = {};
if (this.addItem.category==''){
updates['/' + this.addItem.text + '/'] = "null";
}
else if (this.addItem.subcategory==''){
console.log('adding a subcategory: ' + this.addItem.subcategory);
console.log(this.addItem.category + ' is the category name');
updates['/' + this.addItem.category + '/' + this.addItem.text + '/'] = "null";
}
db.ref('categories').update(updates).then((successMessage) => {
// successMessage is whatever we passed in the resolve(...) function above.
// It doesn't have to be a string, but if it is only a succeed message, it probably will be.
console.log("Yay! " + successMessage);
});
它引用了以下數據:
data(){ return {
addItem: {
open: false,
count: 0,
category: '',
subcategory: '',
kks: {
name: ''
},
document: {
name: ''
},
product: {
name: ''
},
text: ''
},
}}
}
這裏是火力點屬性:
firebase: function(){
return {
categories: db.ref('categories')
}
}
[1]: https://i.stack.imgur.com/hYZN6.png
不知道發生了什麼,但讓我建議使用類別[addItem.category]的計算屬性。 計算:{selectedCategory(){return this.categories [this.addItem.category]; }}並參見。 –
@GerardoRosciano我已經嘗試過了,不幸的是它不起作用 –
@GerardoRosciano明白了,看到我添加的答案 –