Como gerar a interface do usuário dynaimc na resposta JSON react-native

// Aqui estou tentando gerar uma interface dinâmica. Através da API, estou obtendo alguma resposta no formato JSON, preciso desenhar isso na interface do usuário. Como não estou definindo nenhum "TextInput", ele deve gerar dinamicamente. Abaixo está uma amostra de resposta JSON. Isso pode mudar em solicitações diferentes. Por favor, ajudem, estou preso abaixo é apenas um código, não sei como fazer isso.

import * as React from 'react';
import { Text, View, StyleSheet, Alert, Picker } from 'react-native';
import { Constants } from 'react-native';
import { TextInput } from 'react-native-gesture-handler';

var myloop = [];
export default class UiDynamic extends React.Component {

  // add a selectValue to your state to stop the overwriting
  state = {
    PickerValueHolder: [],
    selectedValue: ''
  }

  componentDidMount() {
    // remove the return 
   fetch('http://userapi/inventory/viewinventorytype', {  
        method: 'POST',
        headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          "username" :"admin",
          "password" :"admin"
        })
      }).then((response) => response.json())
      .then((responseJson) => {
        // use the inventoryTypeData as it is already an array
        let PickerValueHolder = responseJson.inventoryTypeData;
        for (let i = 0; i < PickerValueHolder.length; i++) {
            datavalue=() => {
                <Text>Hello ABhi</Text>
                console.log("Hello ABhi");   
            }
        }

        this.setState({ PickerValueHolder }); // Set the new state
      })
      .catch((error) => {
        console.error(error);
      });
    }

  GetPickerSelectedItemValue=()=>{
    Alert.alert(this.state.PickerValueHolder);
  }

  render() {


    for (let i = 0; i < 10; i++) {
        datavalue=() => {
            <Text>Hello ABhi</Text>
            console.log("Hello ABhi");   
        }
      myloop.push(
        <View key={<TextInput></TextInput>}>
        <Text style={{ textAlign: 'center', marginTop: 5 }} >{<Text>Hello</Text>}</Text>
        </View>
      );
    }


    return (
      <View style={styles.container}>
      {this.datavalue.bind(this)}
      {myloop}

      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
  }
});

// Abaixo está uma amostra de resposta JSON. Suponha que aqui estejam quatro atributos e seu tipo de dados, portanto, na interface do usuário 4, "TextInput" deve gera

{
  "inventoryTypeData": [{
    "data type": int,
    "Field 1": ""
  }, {
    "data type": string,
    "Field2": ""
  }, {
    "data type": int,
    "Field 3": ""
  }, {
    "datatype": int,
    "Field4": ""
  }],
  "success": "true"
}