Как передать данные в массив, который находится внутри функции данных, из смонтированной функции в vue. js - PullRequest
0 голосов
/ 09 марта 2020

Я пытаюсь передать данные в полученный массив, который находится внутри функции данных. Я извлекаю данные из базы данных и хочу отобразить в таблице vue, но отображается ошибка

Uncaught TypeError: Невозможно установить Может ли кто-нибудь помочь мне, как это сделать? Заранее спасибо

TypeError: Cannot set property 'receieved' of undefined
    at eval (Main.vue?48a8:78)
    at eval (index.cjs.js?8c4d:4337)
    at LLRBNode.inorderTraversal (index.cjs.js?8c4d:2689)
    at LLRBNode.inorderTraversal (index.cjs.js?8c4d:2688)
    at SortedMap.inorderTraversal (index.cjs.js?8c4d:3139)
    at ChildrenNode.forEachChild (index.cjs.js?8c4d:3748)
    at DataSnapshot.forEach (index.cjs.js?8c4d:4336)
    at eval (Main.vue?48a8:74)
    at eval (index.cjs.js?8c4d:4551)
    at exceptionGuard (index.cjs.js?8c4d:700)

<script>
import firebase from 'firebase';
export default {
    data(){
      return{
          receieved: [],
      }
    },
    name: 'Main',
      mounted(){ 
        var detailRequestRef = firebase.database().ref("nokia_track/current_location");
        detailRequestRef.on('value', function(snapshot){
        snapshot.forEach(function(child) {
          //Retrieve Request Data
          var detailRequestData = child.val();
          console.log(detailRequestData);
          this.receieved = detailRequestData
          console.log(receieved);
         });
     });
  }
}

</script>

`

Ответы [ 3 ]

1 голос
/ 09 марта 2020
// without arrow function
mounted() { 
  const that = this;
  var detailRequestRef = firebase.database().ref("nokia_track/current_location");
  detailRequestRef.on('value', function(snapshot){
  snapshot.forEach(function(child) {
    var detailRequestData = child.val();
    that.receieved.push = detailRequestData;
  });
});


// with arrow function
mounted() { 
  var detailRequestRef = firebase.database().ref("nokia_track/current_location");
  detailRequestRef.on('value', (snapshot) => {
  snapshot.forEach(function(child) {
    var detailRequestData = child.val();
    this.receieved.push = detailRequestData
  });
});
0 голосов
/ 09 марта 2020

Использовать функцию стрелки вместо функции итератора forEach. Поскольку контекст this не является компонентом vue.

detailRequestRef.on('value',(snapshot)=>{//arrow function
        snapshot.forEach((child)=>{//arrow function
          //Retrieve Request Data
          var detailRequestData = child.val();
          console.log(detailRequestData);
          this.receieved.push(detailRequestData)

         });
         console.log(receieved);
     });

или

var self = this;//set function context to a var.
detailRequestRef.on('value',(snapshot)=>{
        snapshot.forEach(function(child) {
          //Retrieve Request Data
          var detailRequestData = child.val();
          console.log(detailRequestData);
          self.receieved.push(detailRequestData)//use it

         });
         console.log(receieved);
     });
0 голосов
/ 09 марта 2020

Это, вероятно, сработает, а не с ошибкой

<script>
import firebase from 'firebase';
export default {
    data(){
      return{
          receieved: [],
      }
    },
    name: 'Main',
      mounted(){ 
        var detailRequestRef = firebase.database().ref("nokia_track/current_location");
        detailRequestRef.on('value',(snapshot) => {
        snapshot.forEach(function(child) {
          //Retrieve Request Data
          var detailRequestData = child.val();
          console.log(detailRequestData);
          this.receieved = detailRequestData
          console.log(this.receieved);
         });
     });
  }
}

</script>

Но я думаю, что вы ищете:

<script>
import firebase from 'firebase';
export default {
    data(){
      return{
          receieved: [],
      }
    },
    name: 'Main',
      mounted(){ 
        var detailRequestRef = firebase.database().ref("nokia_track/current_location");
        detailRequestRef.on('value',(snapshot)=>{
        snapshot.forEach(function(child) {
          //Retrieve Request Data
          var detailRequestData = child.val();
          console.log(detailRequestData);
          this.receieved.push(detailRequestData)

         });
         console.log(this.receieved);
     });
  }
}

</script>

  1. Когда вы внутри функции, вы не можете оцените область применения приложения, если вы не используете синтаксис функции стрелки.
  2. Вы хотите добавить данные, когда вы превысите l oop, добавить в массив и вывести после того, как у вас есть все данные в массиве
...