如何在react-native中执行Horizontal ListView或FlatList

2 回答

• 39

  答案是将水平属性集添加到 true .

  是的，它没有在文档中描述：https://facebook.github.io/react-native/docs/listview.html

  显然，ListView是ScrollView的Child，所以他得到了Horizontal Bool .

  <ListView
      horizontal={true}
      style={{flex:1}}
      dataSource={this.state.dataSource}
      renderRow={(data) => <Row {...data} />}
  />
  
  <FlatList
      horizontal={true}
      data={this.props.data}
      extraData={this.state}
      keyExtractor={this._keyExtractor}
      renderItem={this._renderItem}
  />
  

  再见

  回复于 2024-04-30T02:28:15+08:00
• 2

  感谢最后的答案，ListView现已弃用 .

  FlatList的解决方案：

  <FlatList
      style={styles.videos_flatList}
      horizontal={true}
      data={data1}
      renderItem={({item}) => 
          <RowItem/>
      }
  
      ItemSeparatorComponent={() => {
          return (
              <View
                  style={{
                  height: "100%",
                  width: 20,
                  backgroundColor: "#CED0CE",
  
                  }}
              />
          );
      }}
  
      keyExtractor={(item, index) => index.toString()}
  />
  

  回复于 2024-04-30T02:28:15+08:00