我是新的React Native,所以我可能会问一些非常明显的,但请帮助。
我把一个视图包裹在一个可触摸的控件中,这样整个区域都能响应点击。然后在视图中嵌套一个ScrollView。总体结构如下:
<TouchableWithoutFeedback onPress={this.handlePress.bind(this)}>
<View>
<ScrollView>
<Text>Hello, here is a very long text that needs scrolling.</Text>
<ScrollView>
</View>
</TouchableWithoutFeedback>
当这个编译和运行时,点击被检测到,但是滚动视图根本不滚动。我把上面的代码做得简短而简单,但是每个组件都有适当的样式,我可以看到一切都渲染得很好,长文本在滚动视图的底部被切断。请帮助。
谢谢大家!
7条答案
按热度按时间gzszwxb41#
这就是我的工作:
onStartShouldSetResponder
prop 停止触摸事件向TouchableWithoutFeedback
元素传播。0g0grzrc2#
bmp9r5qi3#
您可以在TouchableWithoutFeedback中使用scrollView或FlatList。虽然您不应该这样做,但有时您别无选择。仔细阅读以下问题和答案可以验证这一点。close react native modal by clicking on overlay,how to dismiss modal by tapping screen in react native。
对于这个问题,你可以让它工作的唯一方法(至少我知道的),或者最简单的方法是在你的代码中的文本周围添加一个TouchableOpacity,如下所示,
注:TouchableOpacity是一个 Package 器,用于使视图对触摸做出正确响应,以便您可以自动设置视图组件的样式,然后将其一些特殊属性设置为您想要的任何内容,例如activeOpacity等。此外,您可以使用TouchableHighlight它工作,但它接收一个子元素,即您将所有组件包含在父元素中。
hfsqlsce4#
我用的是这种结构,它对我很有效:
ao218c7q5#
我发现,对于我的情况,其他例子不起作用,因为他们禁用了点击或滚动的能力。
我碰巧需要多个块,但是你可以在数据数组中为一段文本使用一个元素,这样可以触发press事件,也可以滚动文本。
fcwjkofz6#
尝试在TouchableWithoutFeedback组件中使用ScrollView组件可能会导致一些意外的行为,因为TouchableWithoutFeedback组件的设计目的是捕获用户手势并触发操作,而ScrollView组件的设计目的是允许用户滚动浏览内容。
除非有充分的理由,否则不要使用。所有响应按下的元素在触摸时都应该有视觉反馈。
TouchableWithoutFeedback
只支持一个子组件。如果希望有多个子组件,请将它们 Package 在一个视图中。重要的是,TouchableWithoutFeedback
的工作方式是克隆其子对象并对其应用响应者 prop 。因此,任何中间组件都需要通过这些属性传递到底层ReactNative组件。67up9zun7#
也就是说,您不能在TouchableWithoutFeedback内拥有滚动视图,因为react native的属性会禁用它,您可以将滚动视图置于TouchableWithoutFeedback选项卡之外,并在单击视图标记时添加您想要的其他内容。
如果TouchableWithoutFeedback不起作用,您也可以改用可触摸高亮显示。