Question

我是本机的新手，在阅读教程时，我陷入了FlatList滚动的困境。在使用相同代码的教程上，我可以看到列表正在滚动。我正在使用Android模拟器。

class LibraryList extends Component {


    renderItem = ({ item }) => (
         <ListItem library={item} />
      );

    render() {
        console.log(this.props.libraries);
        return (

            <FlatList
                data={this.props.libraries}
                renderItem={this.renderItem}
                keyExtractor={library => library.id.toString()}
        />
        );
    }
}

const mapStateToProps = state => {
    return { libraries: state.libraries };
};

export default connect(mapStateToProps)(LibraryList);

Answer 1

尝试用FlatList为View的空flex包装您的1。

因此您的渲染方法代码将类似于以下代码：

 render() {
        console.log(this.props.libraries);
        return (
          <View style={{flex:1}}>
            <FlatList
                data={this.props.libraries}
                renderItem={this.renderItem}
                keyExtractor={library => library.id.toString()}
              />
         </View>
        );
    }

希望这会对您有所帮助。

Answer 2

尝试使用此代码块（例如，更改此自身代码）

 renderFlatList() {
    return (
      <FlatList
        data={this.props.database}
        ListHeaderComponent={() => this.renderAddFeedScool()}
        renderItem={({ item }) => this.renderItem(item)}
      />
    );
  }    
render() {
    return (
      <View style={_styles.container}>
        {this.props.database.length > 0 ? (
          this.renderFlatList()
        ) : (
          <Text>Loading</Text>
        )}
      </View>
    );
  }

Styles..
container: {
flex: 1,
},

完整代码：https://github.com/VB10/Nativer/blob/master/src/view/tab/school/index.tsx

看看https://facebook.github.io/react-native/docs/flatlist 和:)最终解决方案使用基于本机的列表组件，我认为完全是解决方案https://docs.nativebase.io/Components.html#list-def-headref

辛苦了。

Answer 3

尝试在滚动视图中添加胖列表

<View style={styles.lastplayedlist}>
          <ScrollView>
            <FlatList
              data={this.state.dataSource}
              renderItem={({ item }) => {

                const artist = item.artist === "" ? "" : ' by ' + item.artist;

                return <Text style={styles.flatListItems}>{item.title + artist}</Text>
              }
              }
              keyExtractor={(item, index) => index}
            />
          </ScrollView>
        </View>

FlatList无法在Android模拟器上滚动

3 个答案: