Question

大家好，我使用的是本机react的Section列表，因为Im会显示其详细信息。我想仅在第一次使用R initialNumToRender={1}进行渲染时显示两个部分，但这无济于事我该怎么做

这是我的数据数组

    var A = ['Apple', 'Apricot', 'Avocado'] ;
    var B = ['A banana is an edible fruit – botanically a berry.The fruit is variable in size, color, and firmness, but is usually elongated and curved, with soft flesh rich in starch covered with a rind, which may be green, yellow, red, purple, or brown when ripe. The fruits grow in clusters hanging from the top of the plant. Almost all modern edible seedless (parthenocarp) bananas come from two wild species – Musa acuminata and Musa balbisiana. The scientific names of most cultivated bananas are Musa acuminata, Musa balbisiana, and Musa × paradisiaca for the hybrid Musa acuminata × M. balbisiana, depending on their genomic constitution. The old scientific name Musa sapientum is no longer used. ', 'Blackberry', 'Blackcurrant', 'Blueberry', 'Boysenberry'] ;
    var C = ['Cherry', 'Coconut'] ;

这是我的部分列表：=>

<SectionList
        sections={[
          { title: 'Fruits Name From A', data: A },
          { title: 'Fruits Name From b', data: B },
          { title: 'Fruits Name From c', data: B },
        ]}
        initialNumToRender={1}
        renderSectionHeader={ ({section}) => <Text style=                                {styles.SectionHeaderStyle}>
    { section.title } </Text> }
        renderItem={ ({item}) =>
        <View>
       <TouchableOpacity onPress={this.showtext}><Text style={styles.SectionListItemStyle}  //onPress={this.GetSectionListItem.bind(this, item)}

       numberOfLines={this.state.showtext ? 4 : 0}
       >
       { item }

      </Text>
    </TouchableOpacity>
     </View>
     }

        keyExtractor={ (item, index) => index }

      />

Answer 1

您可以将节设置为数组，然后在render方法期间调用slice()以将数组限制为所需的数量。看起来可能像这样：

constructor(props){
    //...
    this.state = { sliceNumber : 1};
}

然后在SectionList中将节设置为您在其他地方定义的数组。 sections = {sectionsArray.slice(0, this.state.sliceNumber)}。当您想拥有更多部分时，可以使用 this.setState({sliceNumber : 2});和ui会呈现不同数量的节。

在“部分”列表中仅显示数组的前两个项目

1 个答案: