React Native - 數據網格

Question

我正在研究Android/iOS的商業應用程序，用戶可以通過向表格/數據網格中添加項目來創建發票。我正在使用React Native，並正在尋找適當的組件。要求是添加/刪除行和更改單元格。

我嘗試了一些組件，但它們不符合我的需求。

您是否對React Native下的數據網格有任何建議？

Answer 1

您需要的最佳選擇是使用FlatList組件。由react-native團隊推薦，其表現良好（見here）。 FlatList也很容易使用，你可以閱讀它的一個有用的文件here。的FlatList一個簡單的例子是這樣的：

_keyExtractor = (item, index) => item.id; 

    _renderItem = ({item}) => (
    <MyListItem 
     id={item.id} 
     title={item.title} 
    /> 
); 

    render() { 
    return (
     <FlatList 
     data={this.state.data} 
     extraData={this.state} 
     keyExtractor={this._keyExtractor} 
     renderItem={this._renderItem} 
     /> 
    ); 
    } 

您可以添加或從FlatList輸入列表中刪除的項目（在本例中this.state.data）簡單，由this.state值傳遞給extraData支柱，FlatList將會意識到您的狀態變化，並會自動更新並獲得最佳性能。