反應本機中的自定義平面列表項目

我正在嘗試創建一個列表項列表。我設法使用https://facebook.github.io/react-native/docs/flatlist.html中的一個樣本來構建一個。反應本機中的自定義平面列表項目

我想通過創建更復雜的東西來擴展這個，但我被卡住了。我正在嘗試創建一個列表項目，如下所示。當然，我可以通過使用這些反應原生庫之一來實現這一點，但我試圖避免使用庫，而不是使用庫我想構建一個具有多個呈現器的平板列表組件，因爲這種方法會給我更多的組件控制權。希望對此有幫助。

來源

2017-10-17 Rigorous implementation

您是否試圖在將其添加到列表之前拆分日期？在將數組放入列表之前，您還可以創建視圖。比你只需在renderItem函數中返回項目本身。 – parohy

你可以使用['numColumns']（https://facebook.github.io/react-native/docs/flatlist.html#numcolumns） – bennygenel

我應該爲每一行建立一個jsx嗎？ –

實現這一目標最簡單的方法是有一個行組件，並根據道具你決定如何渲染它。例如：

class Row extends React.PureComponent { 

    render(){ 
     const { item } = this.props 
     if(item.break){ 
     return <Text>Break</Text> 
     } 
     return (
     <View><Text>Normal item goes here</Text></View> 
    ) 
    } 
}

來源

2017-10-17 23:28:24

謝謝。這就說得通了。當我創建像出口缺省功能FlatList（{ 的ListData }：{ 的ListData：串 }）可共享flatlist部件{ 回報（ <查看風格= {{撓曲：1}}> ） } renderRow將含有構建JSX的邏輯，但與此我碰到一個錯誤說「最大調用堆棧大小突破」。是否因爲我無法將json字符串作爲參數傳遞給我的自定義組件？ –

您不應該調用您的功能組件FlatList，因爲當您在jsx中使用原始的FlatList時，它會將您的自定義函數引入遞歸。將其更改爲只是列表 –

我不認爲我們有一個反應原生列表。你是不是指ListView？ –

反應本機中的自定義平面列表項目

回答

相關問題