Реагировать на собственный ListView для миграции FlatList

Question

Итак, я начал изучать реакцию на видео из видео, и они использовали ListView, но так как ListView скоро будет устаревшим и будет удален.Я узнаю, что FlatList будет подходящей заменой, но, будучи новичком, я не могу перейти на Flatlist.

import React, { Component } from "react";
import { ListView } from 'react-native';
import { connect } from 'react-redux';
import ListItem from './ListItem';

class LibraryList extends Component {

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

        this.dataSource =ds.cloneWithRows(this.props.libraries);
    }

    renderRow(library) {
        return <ListItem library = { library } />;
    }
    render() {
        return(
            <ListView
            dataSource = {this.dataSource}
            renderRow = {this.renderRow}
            />

        );
    }
}

const mapStateToProps = state => {

    return { libraries: state.libraries };

}; 

export default connect(mapStateToProps) (LibraryList);   

Answer 1

Добро пожаловать в stackoverflow.

Миграция должна быть довольно простой, вам больше не нужно dataSource.Вы можете передать свой массив элементов непосредственно Компоненту.

import React, { Component } from "react";
import { FlatList } from 'react-native';
import { connect } from 'react-redux';
import ListItem from './ListItem';

class LibraryList extends Component {
    renderRow({item}) {
        return <ListItem library = { item } />;
    }
    render() {
        return(
            <FlatList
                data = {this.props.libraries}
                renderItem = {this.renderRow}
            />
        );
    }
}

const mapStateToProps = state => {

    return { libraries: state.libraries };

}; 

export default connect(mapStateToProps) (LibraryList); 

Заголовок к документации здесь , чтобы узнать больше.