Как превратить Объект (данные из базы данных) в массив и показать один из его ключей на симуляторе - PullRequest
0 голосов
/ 12 октября 2019

Итак, я пытаюсь визуализировать мою базу данных Firebase на моем симуляторе Android, и она показывает ошибку, в которой решение заключается в преобразовании объекта в массив, но я не знаю, как это сделать.

import _ from 'lodash';
import React, {Component} from 'react';
import {connect} from 'react-redux';
import {FlatList, View, Text} from 'react-native';
import {employeesFetch} from '../actions';
import ListItem from './ListItem';

class EmployeeList extends Component {
    componentDidMount(){
        this.props.employeesFetch();
}

renderRow(employee) {
            return <ListItem employee={employee}/>;
    };

    render(){
        console.log(this.props.employees);
        return (
            <View>
                <FlatList
                data={Object.keys(this.props.employees)}
                renderItem={this.renderRow}
                />
            </View>
        );
    }
}

const mapStateToProps = state => {
    const employees = _.map(state.employees, (val, uid) => {
        return { ...val, uid };
    });

    return { employees };
};

export default connect(mapStateToProps, { employeesFetch })(EmployeeList);

Этот помощник mapStateToProps должен создать переменную с именем employee (если я не ошибаюсь, я просто учусь кодировать), но когда я записываю это так:

<FlatList
data=employees
renderItem={this.renderRow}
/>

Это говорит о том, что сотрудники не определены. На всякий случай, я добавлю файл ListItem, чтобы показать, что я там сделал.

import React, {Component} from 'react';
import {Text} from 'react-native';
import {CardSection} from './common';

class ListItem extends Component {
  render () {
    const { name } = this.props.employee;

    return (
      <CardSection>
        <Text style={styles.titleStyle}>
          {name}
        </Text>
      </CardSection>
    );
  }
}
export default ListItem;

Я ожидаю, что вывод будет список, показывающий сотрудников (записанных в базе данных Firebase) на экране, но этос ошибкой: Нарушение инварианта: объекты недопустимы как дочерний элемент React (найдено: объект с ключами {имя, телефон, смещение, uid}). Если вы хотите отобразить коллекцию дочерних элементов, используйте вместо этого массив.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...