EDITAR :

Como señaló correctamente @Bergi, en realidad no necesitamos bind la función renderData , ya que el state está correctamente disponible para el método. Me tomé la libertad de crear un violín para verificar los problemas, y de hecho es con la response de la llamada API.

response.data devuelve un object pero response.data.data es una Array . Está corregido en el violín .

 UNSAFE_componentWillMount() { console.log('componentWillMount'); axios.get('https://reqres.in/api/users') .then(response => { this.setState({ data: response.data.data}) }); }

Debe bind renderData al alcance léxico correcto para reaccionar para poder referirse al estado de su componente definido dentro. Además, recomendaría verificar su response.data . Los datos devueltos por la llamada a la API antes de configurar el estado.

Otra opción es usar la función de flecha renderData = () => {...} pero tiene el inconveniente de que cada instancia de su componente obtendrá su propia copia de esta función, aumentando así su huella de memoria.

Puedes hacer lo siguiente:

 import React, {Component} from 'react'; import {View, Text} from 'react-native'; import axios from 'axios' //servislere bağlanabilmek için class haline getireceğiz class Liste extends Component { constructor(props) { super(props); this.state = {data: [] }; this.renderData = this.renderData.bind(this); } UNSAFE_componentWillMount() { console.log('componentWillMount'); axios.get('https://reqres.in/api/users') .then(response => { if(response && Array.isArray(response.data)) { this.setState({ data: response.data}) } else { // handle the type mismatch here } }); } componentDidMount() { console.log('componentDidMount'); } renderData() { return this.state.data.map( responseData => <Text> {responseData.title} </Text> ); } render() { console.log('gelen data', this.state); console.log('render'); return ( <View style={{marginTop: 5}}> {this.renderData()} </View> ); } } export default Liste;