Question

我试图将一个FlatList放在一个Modal中，但是List只是溢出了我给它的容器而不是滚动。我试过添加flex等等，但是没有运气让List保持在界限之内。有什么建议吗？

＆＃13;

Here is the Modal

const modalContainer = {
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
flex: 1,
  };

  const innerContainer = {
alignItems: 'center',
// flex: 1,
height: 130,
backgroundColor: colors.white.white,
borderRadius: borderRadius.sm,
width: 450,
  };

  render() {
    const styles = styleMaker();

    return (
      <View>
        <Modal visible = {this.props.visible}>
          <View style={styles.overlay} />
          <View style = {styles.modalContainer}>
          <View style = {styles.innerContainer}>
            {this.props.children}
          </View>
          </View>
        </Modal>
      </View>
    );
  }

＆＃13;

Answer 1

这对我有用：

使用ScrollView和onStartShouldSetResponder={(): boolean => true}的视图包装Flatlist

完整示例：

<Modal
   ....>
  <View style={{ height: 300 }}>
    <ScrollView>
      <View onStartShouldSetResponder={(): boolean => true}>
        <FlatList
         ....
          />
      </View>
    </ScrollView>
  </View>
</Modal>

Answer 2

0         0         0         0
0.2706    0.6533    0.6533    0.2706
0.5000    0.5000   -0.5000   -0.5000
0.6533   -0.2706   -0.2706    0.6533

您可以在下面找到一个示例链接

https://snipsave.com/javawebline/#/snippet/ZYgnr5nu2hHPrM8atX

在模态内部反应Native FlatList

2 个答案: