RoomList.js

import React, {Component} from 'react';

const testArr1 = [1,2,3];
const testArr2 =[{one:1},{two:2},{three:3}];

class RoomList extends Component {
constructor(props) {
  super(props);
      this.state = {
        rooms: []
    };
      this.roomsRef = this.props.firebase.database().ref('rooms');
}

componentDidMount() {
     this.roomsRef.on('child_added', snapshot => {
       const room = snapshot.val();
       room.key = snapshot.key;
       console.log(snapshot.val());
       this.setState({rooms: this.state.rooms.concat(room)});
       console.log('Looped through');
       console.log(this.state.rooms);
     });
   }

/*
OBJECT FROM firebase DB

{bloc-chat-react-6f40c}
|_rooms
  |_1
  | |_ {name: 'room1'}
  |
  |_2
  | |_ {name: 'room2'}
  |
  |_3
    |_ {name: 'room3'}

*/

render() {
  return (
    <div className="App">
      <h1 className='title'>Bloc Chat</h1>
      <div>
        {testArr2} //doesnt work!
      </div>
    </div>
  );
}

}

export default RoomList;