Недопустимое свойство data типа number передано в DataProvider, ожидается массив array. React- bootstrap -table2, база данных Firebase в реальном времени - PullRequest
Новая
       82

Недопустимое свойство data типа number передано в DataProvider, ожидается массив array. React- bootstrap -table2, база данных Firebase в реальном времени

0 голосов
/ 05 августа 2020

Я пытался получить данные из базы данных Firebase Realtime и отобразить их в response- bootstrap -table2, но у меня возникли некоторые проблемы, когда дело доходит до фактического отображения данных. Когда я запускаю код, я получаю сообщение об ошибке: Failed prop type: Invalid prop data of type number provided to DataProvider, expected array.

Вот мой code: 

const App = () => {
  const [timestamp, setTimestamp] = useState([]);
  const [loading, setLoading] = useState(false);
  const getTimestamp = () => {
    const database = db.ref("timestamped_measures");
    database.on("value", (ts_measures) => {
      ts_measures.forEach((ts_measure) => {
        setTimestamp(ts_measure.val().timestamp);
      });
    });
  };

  const columns = [{ dataField: "timestamp", text: "Timestamp" }];
  useEffect(() => {
    getTimestamp();
  }, []);
  return (
    <div className="App">
      <BootstrapTable
        keyField="timestamp"
        data={timestamp}
        columns={columns}
        pagination={paginationFactory()}
      />
    </div>
  );
};

export default App;

Так выглядит моя база данных Firebase

Любая помощь приветствуется!

Редактировать: console. журнал (отметка времени) console.log (тип отметки времени)

1 Ответ

0 голосов
/ 05 августа 2020

Вам необходимо отобразить результаты вашей временной метки из ts_measures в массив и сохранить его в состоянии. Я предполагаю, что, поскольку ваши столбцы содержат поле данных «метка времени», для каждой из ваших строк данных потребуется этот ключ, который будет содержать данные для столбца TimeStamp. 

{timestamp: ts_measure.val().timestamp}

Попробуйте это 

const getTimestamp = () => {
  const database = db.ref("timestamped_measures");
  database.on("value", (ts_measures) => {
   setTimestamp(ts_measures.map((ts_measure) => {
      return {timestamp: ts_measure.val().timestamp}
    }));
  });
};
...