React Native-WebView滚动的Android问题

时间:2018-10-20 00:32:02

标签: react-native react-native-android

WebView滚动在Android中不起作用。我搜索了很多东西,也看到了很多其他地方,没有人能提供帮助。

这就是我定义组件的方式

 <WebView
    automaticallyAdjustContentInsets={false}
    source={{uri: this.props.url}}
    javaScriptEnabled={true}
    domStorageEnabled={true}
    decelerationRate="normal"
    startInLoadingState={true}
    scalesPageToFit={isAndroid ? false : true}
/>

这似乎是一个反应性的本地错误(永远存在),但是应该有一种解决方法。

-更新-

我发现这不是WebView的问题,它的发生是因为我将其放在模态中,并且需要TouchableWithoutFeedback来隐藏模态,并且当它们接触模态时当然也不要隐藏。 TouchableWithoutFeedback窃取了新闻发布活动,但滚动无效。

<Modal
    animationType='fade'
    onRequestClose={() => { }}
    transparent
    visible={visible} //its either true or false, if its ture it will be displayed if false, it will hide
>
    <TouchableWithoutFeedback onPress={onDecline} >
        <View style={containerStyle}>
            <Ionicons name="md-close" size={24} color={colors.primary} style={closeIconStyle} />
            <TouchableWithoutFeedback onPress={() => { }} >
                <View style={popupStyle}>
                    <View style={styles.textContainer}>
                        <Text style={textStyle}>
                            {this.props.title}
                        </Text>
                    </View>
                    <View style={[cardSectionStyle, {
                        marginTop: 5
                    }]}>

                        <View style={{ height: SCREEN_HEIGHT - 300, width: SCREEN_WIDTH - 80 }}>
                            <WebView
                                source={{ uri: this.props.url }}
                                style={contentStyle}
                                automaticallyAdjustContentInsets={false}
                                javaScriptEnabled={true}
                                domStorageEnabled={true}
                                decelerationRate="normal"
                                startInLoadingState={true}
                            />

                        </View>
                    </View>
                </View>
            </TouchableWithoutFeedback>

        </View>
    </TouchableWithoutFeedback>
</Modal>

1 个答案:

答案 0 :(得分:0)

您可以在style={flex: 1}标签中添加<Webview />

如果仍然无法使用,请尝试以下操作:

<WebView
    source={{uri: this.props.url }}
    style={{marginTop: 20, flex: 1}}
    javaScriptEnabled={true}
    domStorageEnabled={true}
    startInLoadingState={true}
/>