Как сделать многомерный массив реагировать на нативные в этом формате данные: [[], [], []]?

Question

Я использую компонент Resact-Native-Table в своем проекте, и формат принятых данных массива должен быть таким:

tableData: [
   ['1', '2', '3',],
   ['a', 'b', 'c',],
   ['1', '2', '3',],
]

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

Я попробовал этот код:

this.state.tableData.push('1');
this.state.tableData.push('2');
this.state.tableData.push('3');

, но кажется, что формат данных в массиве похож наэто:

tableData: [1,2,3]

Данные будут получены из моей базы данных Firebase выглядит следующим образом:

firebase.database().ref('Budgets/id/Expenses').once("value", function(snapshot) {
          snapshot.forEach(function(data) {
            this.state.tableData.push(data.val().name);
            this.state.tableData.push(data.val().amount);
            this.state.tableData.push(data.val().frequency);           
          })
}).catch((error) => {
    console.log(error);
});

Любая идея или предложение, чтобы придумать этот формат массива?

РЕШЕНИЕ:

let roww = [];
let that = this;
    firebase.database().ref('Budgets/id/Expenses').once("value", function(snapshot) {
      snapshot.forEach(function(data) {
        roww.push([data.val().name,data.val().amount,data.val().frequency]); 
        that.setState({tableData: roww});
      })
    }).catch((error) => {
      console.log(error);
    });

Answer 1

Это рабочий пример.Я думаю, что это поможет решить вашу проблему.Проверьте компонентDidmount ()

import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';
import { Table, Row, Rows } from 'react-native-table-component';

export default class ExampleOne extends Component {
  constructor(props) {
    super(props);
    this.state = {
      tableHead: ['Head', 'Head2', 'Head3', 'Head4'],
      tableData: [
        ['1', '2', '3', '4'],
        ['a', 'b', 'c', 'd'],
        ['1', '2', '3', '456\n789'],
        ['a', 'b', 'c', 'd']
      ]
    }
  }
  componentDidMount(){

var myarray=new Array(3)
var k= 1
var j= 2
var l= 9
for (var i=0; i <3; i++)
    myarray[i]=[j,k,l]

  this.setState({tableData:myarray})

  }

  render() {
    const state = this.state;
    return (
      <View style={styles.container}>
        <Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff'}}>
          <Row data={state.tableHead} style={styles.head} textStyle={styles.text}/>
          <Rows data={state.tableData} textStyle={styles.text}/>
        </Table>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: { flex: 1, padding: 16, paddingTop: 30, backgroundColor: '#fff' },
  head: { height: 40, backgroundColor: '#f1f8ff' },
  text: { margin: 6 }
})

Вы также можете проверить здесь Экспо закуски

Answer 2

Я не совсем уверен, в чем проблема .. если принятый формат - это двумерный массив, ну ... создайте его.

let firstRow = [1,2,3]
this.state.tableData = [firstRow]

Push action

this.state.tableData[0].push(1)

Малопоможет более подробная информация

РЕДАКТИРОВАТЬ: попробуйте это (пожалуйста, обратите внимание this.state.tableData должны быть инициализированы)

          snapshot.forEach(function(data) {
            this.state.tableData.push([data.val().name,data.val().amount,data.val().frequency]);           
          })