如何在我的 firebase 子节点中引用数据？

Question

我正在尝试使用 for 循环引用 firebase 数据库的子节点。我正在使用 Vue 和 Vue-fire。问题是在下面的代码中，categories[addItem.category] 没有引用正确的数据。

<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'，应该会给出 'machinery'。目前，选择 'mechanical' 会使 categories[addItem.category] 等于 undefined。这是我的数据库中的数据： [![在此处输入图片描述][1]][1]

谁能告诉我为什么我的 firebase 引用 categories[addItem.category] 没有引用子值？

如果有帮助，我就是这样保存数据的：

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 属性：

 firebase: function(){
 return {
     categories: db.ref('categories')

 }   

 }

  [1]: https://i.stack.imgur.com/hYZN6.png

Answer 1

这是我最后做的。添加以下内容作为计算属性：

 subcategories: function(){
     if (this.addItem.category){
     var val;
     db.ref('categories/' + this.addItem.category).on('value', function(snapshot){
         val = snapshot.val();
     });
     return val;
     }
     return this.categories;
 }

如何在我的 firebase 子节点中引用数据？

How do I reference data in my firebase child nodes?

javascript

firebase

vue.js

vuefire