Не реагировать на родную базовую позицию списка

Я пытаюсь создать элемент списка на основе собственной базы, я уже прочитал этот документ и этот документ

К сожалению, все эти методы не работают. Я считаю, что с моим кодом что-то не так, потому что я новичок, чтобы реагировать на работу

Я получил пустое, когда я запускаю свой код. Вот мой код Пожалуйста, дайте несколько советов, чтобы исправить мою ошибку.

import React from 'react';
import {ListView} from 'react-native';

import { Container, Content, Card, CardItem, Button,  Body,  Text, List, ListItem} from 'native-base';
import {create} from 'apisauce';

import {  AppLoading } from 'expo';


let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});

class UserList extends React.Component {


state = {
        apiAreLoaded: false,
        dataSource: ds
};


constructor() {
    super();



}

async componentDidMount() {



    // define the api
    const api = create({
        baseURL: 'https://reqres.in/',
        headers: {
        Accept: 'application/json'
        }
    })

    // start making calls
    //api.get('/api/users?page=2').then((response) => response.data).then(console.log);

    //use async
    const response = await api.get('/api/users?page=2');  
    console.log(response.data.data);  
    this.setState({ apiAreLoaded: true });


    this.setState = {
        dataSource: ds.cloneWithRows(response.data.data),
        };

    // console.log(this.state.dataSource);




}

render() {




    if(!this.state.apiAreLoaded)
    {
        return  <AppLoading />;

    }



    return(
        <Container>
            <Content>
                <List dataObject={this.state.dataSource}
                renderRow={(item) =>
                    <ListItem>
                        <Text>{item.avatar}</Text>
                    </ListItem>
                }>
                </List>
            </Content>
            </Container>

        // <ListView
        // dataSource={this.state.dataSource}
        // renderRow={(rowData) =>   
        //     <Card>
        //         <CardItem header>
        //         <Text> {rowData.avatar}</Text>
        //         </CardItem>
        //         <CardItem>
        //         <Body>
        //             <Text>
        //             {rowData.first_name}
        //             </Text>
        //         </Body>
        //         </CardItem>
        //         <CardItem footer>
        //         <Text>{rowData.avatar}</Text>
        //         </CardItem>
        //     </Card>


        // }
        // />

    );

}


}



export {UserList};

Спасибо друг.

Источник

1 ответ

Ваш dataArray реквизит List пропал, отсутствует. Попробуйте заменить dataObject с dataArray

<List 
    dataArray={this.state.dataSource}
    renderRow={(item) =>
    <ListItem>
       <Text>{item.avatar}</Text>
     </ListItem>
}/>

См. http://docs.nativebase.io/Components.html.

Список NativeBase устарел. Вместо этого используйте React Native Flatlist.

Источник
Другие вопросы по тегам