反应原生溢出和滚动

Question

我开始学习React Native.据我所知,有一个"overflow:scroll"样式属性和一个ScrollView.在View中使用"overflow:scroll"是否使它成为React Native中的ScrollView？

Answer 1

View没有overflow: scroll属性,文档只显示:

overflow ReactPropTypes.oneOf(['visible', 'hidden'])

制作可滚动视图的唯一方法是使用ScrollView或ListView.

Answer 2

如果你想在本机反应中溢出：滚动那么你必须使用这两个道具

• 滚动启用
• 内容大小改变

像这样

import React, { Component } from "react";
import { ScrollView, View } from "react-native";
const { height } = Dimensions.get("window");

export class index extends Component {
  state = {
    screenHeight: 0,
  };
  onContentSizeChange = (contentWidth, contentHeight) => {
    this.setState({ screenHeight: contentHeight });
  };
  render() {
    const scrollEnabled = this.state.screenHeight > height;
    return (
      <ScrollView
        style={{ flex: 1 }}
        contentContainerStyle={styles.scrollview}
        scrollEnabled={scrollEnabled}
        onContentSizeChange={this.onContentSizeChange}
      >
        <View style={styles.content}></View>
      </ScrollView>
    );
  }
}

export default index;