将变量传递给另一个Vue.js组件

时间:2019-10-21 22:35:32

标签: javascript firebase vue.js

我试图将变量从一个组件传递到另一个组件,以便在Firebase中从该组件执行查询。我有一个数组,它带给我文档的ID,并将其分配给变量,如何从另一个组件中获取此值?

   <v-layout wrap row >
    <v-flex xs12 sm6   v-for="product in products" :key="product.id" >
      <v-card>
        <v-card-media :src="product.src" :key="product.nombre" height="200px">
        </v-card-media>
        <v-card-title primary-title>

          <v-spacer/>
          <v-chip label color="pink" text-color="white">
              {{product.nombre}}
          </v-chip>         
          <v-btn color="green" dark @click="seePrd(product.id)"  >
                 Ver
          </v-btn>
        </v-card-title>

      </v-card>
    </v-flex>
  </v-layout>

</template>

<script>
    import { db } from '@/main';
    import { mapGetters } from 'vuex';


    export default {
        name: "show-products",        
        data () {
            return{
                products: [],
                idSelected:''                
            }
        },
        methods:{          
          seePrd(valId){
             this.idSelected = valId  
            this.$router.push('/administration/ShowProduct');  




          }

        },
        mounted() {                   
            var today = new Date();
            var dd = today.getDate();
            var mm = today.getMonth() + 1;
            var yyyy = today.getFullYear();
            var todayHour = today.getHours();
            var todayMin = today.getMinutes();
            if (dd < 10) {
                dd ='0' +dd;
            } 
            if (mm < 10) {
                mm = '0' + mm;
            }
            today= yyyy + '-' + mm + '-' + dd
           var  todayTime = todayHour + ':' + todayMin        

            db.collection('products').where("limitDate",">=", today).onSnapshot(snapshot => {

                for (var i =0 ; i < snapshot.docs.length; i++){                   
                    db.collection('products').doc(snapshot.docs[i].id).get().then(doc => {
                        var url;
                        var prdName;  
                        var id;

                        if (doc.data().limitDate == today && doc.data().limitHour < todayTime){  
                      } else {
                        url = doc.data().urls[0];
                        prdName = doc.data().productName;
                        id = doc.data().pid;
                        const datos = {
                           src: url,
                           nombre: prdName,
                           id: id
                        }                       

                          this.products.push(datos)                                    

                      }                      

                    })
 }

          }, (error) => {
            console.log('listener products pagination off...');
          }          );


        },








    }


</script> 

我需要访问新组件中的idSelected的方法,以便能够查询Firebase并在该文档中拥有所有数据

0 个答案:

没有答案