Как сделать все элементы в объекте json реагировать на нативный

Question

Мне нужно отобразить все элементы в json-объекте в собственном режиме реакции, но некоторые из них не находятся в массиве и не являются отдельными элементами.

вот мой API:

{
"meta": {
    "code": 200,
    "message": "success",
    "errors": []
},
"data": {
    "users": [
        {
            "userinfo": {
                "username": "hesamsameni",
                "fullname": "hesam sameni",
                "photo": "https://aaa.com/img/hesamsameni.png",
                "skills": {
                    "html": "HTML",
                    "css": "CSS",
                    "javascript": "JAVASCRIPT",
                    "react_native": "REACT NATIVE"
                }
            }
        }
    ]
}
}

вот мой метод рендеринга:

  render() {
return (
  <View>
    <FlatList
      data={this.state.dataSource}
      keyExtractor={(item, index) => index.toString()}
      renderItem={({item}) => 
       <View>
         <Text>{item.fullname}</Text>
         <Image source={{uri: item.photo}}/>
         <Text>Skills:</Text>
         // I need to render all the skills here
       </View>
    }></FlatList>
   </View>

Answer 1

Можете ли вы попробовать это?

lapsList(datas) {
    const keys = Object.keys(datas); // Get all keys from dictionary

    return keys.map((key) => {
      return (
        <Text>{datas[key]}</Text>
      )
    })
}

render() {
return (
  <View>
    <FlatList
      data={this.state.dataSource}
      keyExtractor={(item, index) => index.toString()}
      renderItem={({item}) => 
       <View>
         <Text>{item.fullname}</Text>
         <Image source={{uri: item.photo}}/>
         <Text>Skills:</Text>

         {this.lapsList(item.skills)}
         // I need to render all the skills here
       </View>
    }></FlatList>
   </View>