React Native提取JSON数据到表



我们正在尝试从JSON文件中提取数据并将其放在表中,以便将数据显示得很好。但是,从JSON到一个数组的映射,我们遇到了一些问题。当我们之前尝试过时,我们最终使用了"未定义对象"或一个空表。帮助感谢!

这是JSON文件的摘录。

{
"workOrder1": [
{ "articleNumber": "1", "productName": "Mjölk", "pickUp": "L1H1",  
"dropOff": "M1", "amount": "6", "status": "Klar" },
{ "articleNumber": "2", "productName": "Ägg", "pickUp": "L2H1", "dropOff": "M2", "amount": "3", "status": "Pågående" },
{ "articleNumber": "3", "productName": "Mjöl", "pickUp": "L3H4", "dropOff": "M3", "amount": "1", "status": "Ej påbörjad" }
],
}

和该表的本机代码

constructor(props){
super(props);
this.state = {
tableHead: [ 'Art', 'Prod', 'Hämtas', 'Lämnas', 'Mängd', 'Status'],
tableData: [
    ['1', '2', '3', '4', '5', '6'],
    ['1', '2', '3', '4', '5', '6']
]
}
}
componentDidMount(){
this.fetchWorkOrder();
}
fetchWorkOrder(){
fetch("www.example.com/request", {
  method: 'GET'
})
.then((response) => response.json())
.then((response) => {
  this.setState({
    tableData: response
  });
});
}
render() {
const state = this.state;
return (
  <View style={styles.container}>
  <Text style={styles.header}>Alla arbetsordrar</Text>
  <Table borderStyle={{ borderWidth: 2, borderColor: 'black'}}>
    <Row data={state.tableHead} style={styles.head} textStyle={styles.text}/>
    {
      Object.values(state.tableData).map((workOrder1, index) => {
        <Row
          key={index}
          data={workOrder1}
          style={styles.row}
        />
      })
    }
  </Table>
  </View>
)
}
}

您将错误的值放入表中应该是您放置的对象数组的数组,请尝试以下操作:

    state.tableData.workOrder1.map((e)=>{
    let workOrder1=Object.values(e)
    return(
            <Rows
              key={index}
              data={workOrder1}
              style={styles.row}
            />
     )
  })

相关内容

  • 没有找到相关文章

最新更新