Получать данные из базы - PullRequest
0 голосов
/ 12 февраля 2020

Я экспериментирую с React и firebase. У меня есть функция, которая при загрузке компонента базы данных считывается. Связь работает, и я получаю данные. Тем не менее, это объекты, которые я хотел бы поместить структурированными в массив, который будет считан позже. Я получаю сообщение об ошибке только с текущим кодом: TypeError: Невозможно прочитать свойство 'title' или не определено

Кто-нибудь знает, как я могу гарантировать, что данные, которые я получаю от Firebase: enter image description here

База данных: enter image description here

с этим кодом:

const newEvents = [];

useEffect(() => {
    let ref = Firebase.database().ref('/events');
    ref.on('value' , snapshot => {
        var state = snapshot.val();
        let arrayCount = loopStateEvents(state);
        console.log(state);

        for(var i = 0; i < arrayCount; i++){

            newEvents.push({title: state[i].title, id: state[i].id, resourceId: state[i].resourceId,start: new Date(state[i].yearStart,state[i].monthStart,state[i].dayStart,state[i].hourStart,state[i].minuteStart,state[i].secondStart),end: new Date(state[i].yearStart,state[i].monthStart,state[i].dayStart,state[i].hourEnd,state[i].minuteEnd,state[i].secondEnd)});
            //setEventDb([...eventDb,{title: state[i].title, id: state[i].id, resourceId: state[i].resourceId,start: new Date(state[i].yearStart,state[i].monthStart,state[i].dayStart,state[i].hourStart,state[i].minuteStart,state[i].secondStart),end: new Date(state[i].yearStart,state[i].monthStart,state[i].dayStart,state[i].hourEnd,state[i].minuteEnd,state[i].secondEnd)}]);
        }


    });
},[] );

const loopStateEvents = function(object){
   var length = 0;
  for( var key in object ) {
      if( object.hasOwnProperty(key) ) {
          ++length;
      }
  }
  return length;
}

Может обеспечить получение массива, который структурирован следующим образом:

const events = [
    {
      id: 0,
      title: 'Board meeting',
      start: new Date(2020, 1, 10, 9, 0, 0),
      end: new Date(2020, 1, 10, 9, 15, 0),
      resourceId: 1,
    },
    {
      id: 1,
      title: 'MS training',
      desc: 'this is a test',
      start: new Date(2020, 1, 10, 9, 0, 0),
      end: new Date(2020, 1, 10, 9, 15, 0),
      resourceId: 2,
    },
    {
      id: 1,
      title: 'MS training',
      start: new Date(2020, 1, 10, 9, 10, 0),
      end: new Date(2020, 1, 10, 9, 25, 0),
      resourceId: 2,
    },
    {
      id: 2,
      title: 'Team lead meeting',
      start: new Date(2018, 0, 29, 8, 30, 0),
      end: new Date(2018, 0, 29, 12, 30, 0),
      resourceId: 3,
    },
    {
      id: 11,
      title: 'Birthday Party',
      start: new Date(2018, 0, 30, 7, 0, 0),
      end: new Date(2018, 0, 30, 10, 30, 0),
      resourceId: 4,
    },
  ]

Ответы [ 2 ]

1 голос
/ 12 февраля 2020

Выполните следующие действия:

let ref = Firebase.database().ref('/events');
    ref.on('value' , snapshot => {
        snapshot.forEach((childSnap) => {
        let state = childSnap.val());
        console.log(childSnap);
            newEvents.push({title: state.title, id: state.id, resourceId: state.resourceId,start: new Date(state.yearStart,state.monthStart,state.dayStart,state.hourStart,state.minuteStart,state.secondStart),end: new Date(state.yearStart,state.monthStart,state.dayStart,state.hourEnd,state.minuteEnd,state.secondEnd)});          
    });

Используйте forEach для итерации внутри массива, а затем, используя childSnap, получите доступ к свойствам с помощью точечной нотации.

0 голосов
/ 12 февраля 2020
useEffect(() => {
    let ref = Firebase.database().ref('/events');
    ref.on('value' , snapshot => {
        var state = snapshot.val();
        let events = []
        for (var key in state) {
          events.push(state[key]);
        }
    });
},[] );

используйте for (var key in state), чтобы вы могли напрямую использовать объект, возвращенный из firebase и pu sh, в своем массиве событий, не требуя длины объекта. Вы можете добавить свои пользовательские атрибуты следующим образом:

state[key].start = new Date(state[key].yearStart,state[key].monthStart,state[key].dayStart,state[key].hourStart,state[key].minuteStart,state[key].secondStart)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...