小编Par*_*tts的帖子

反应原生清除堆栈导航器堆栈

我有几个屏幕可以一一浏览。屏幕1->屏幕2-屏幕3->屏幕4-首页

我想要的是当我回家时,应该清除以前的导航历史记录,并且后退按钮不应该转到屏幕 4 的最后一个导航屏幕。目前,当我在主屏幕上按后退按钮时,它会将我带回堆栈中的最后一个路由是 screen4。我使用了下面的代码。它给我错误没有定义路由或关键主页。我已经在 Screens 类中定义的。任何帮助,将不胜感激。

const resetAction = NavigationActions.reset({
  index: 0,                       
  actions: [NavigationActions.navigate({ routeName: 'Home' })],
});

onPress={() =>  this.props.navigation.dispatch(resetAction)}
Run Code Online (Sandbox Code Playgroud)

javascript react-native react-navigation stack-navigator

16
推荐指数
5
解决办法
3万
查看次数

后退按钮反应本机退出应用程序

我已经把android后退按钮退出我的主屏幕中的反应本机应用程序中的应用程序功能.但是当我在其他屏幕上按下android后退按钮时,它也会被调用.

componentDidMount() {

    if (Platform.OS == "android") {
        BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);                           
  }
    this._setupGoogleSignin();           
    this._getUserDetails();
    const { navigate } = this.props.navigation;
    console.log("object url is", this.state.postsArray[0].url);

}

handleBackButton = () => {               
    Alert.alert(
        'Exit App',
        'Exiting the application?', [{
            text: 'Cancel',
            onPress: () => console.log('Cancel Pressed'),
            style: 'cancel'
        }, {
            text: 'OK',
            onPress: () => BackHandler.exitApp()
        }, ], {
            cancelable: false
        }
     )
     return true;
   }
componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
  }
Run Code Online (Sandbox Code Playgroud)

react-native react-native-android

12
推荐指数
2
解决办法
2万
查看次数

在来回导航几次后,背景图像消失了

我用一个背景图片和一些图标在它上面制作了一个简单的视图.单击图标可导航到不同的页面.它工作正常.问题是,当我导航到其他页面返回主页并执行此操作7-8次时,背景图像将从所有屏幕中消失.下面是主屏幕和截图的代码

  <Image
  source={require('../images/background.jpg')}
  style={{
    justifyContent:'center',                                                       
    resizeMode: "stretch",
    height: height,
    width: width,
    alignItems: "center"
  }} >
  <StatusBar
  backgroundColor="#4e0870"
  barStyle="light-content"

/>
<Image style={{ height: 125, width: 125 }} source={require('../images/guru_logo.png')} />

<View style={{
  marginTop: 30,
  flexDirection: 'row'
}}>
  <TouchableOpacity activeOpacity={.5} onPress={() => {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
    navigate("LiveTV")
  }
  }
  >
    <Image
      source={require('../images/live.png')}
      style={{
        resizeMode: "stretch",
        height: 75,
        width: 75
      }} /></TouchableOpacity>
  <TouchableOpacity activeOpacity={.5} onPress={() => {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
    navigate("VideoPage")
  }}>

    <Image
      source={require('../images/youtube.png')}
      style={{
        marginTop: 5,

        resizeMode: "stretch",
        marginLeft: 100,
        height: 75,
        width: 75
      }} …
Run Code Online (Sandbox Code Playgroud)

imageview react-native

8
推荐指数
1
解决办法
799
查看次数

仅加载 Flatlist 中的可见图像反应本机

我使用 Flatlist 制作了图像网格。我正在从网络加载图像。目前,当我导航到该特定页面时,所有图像都会加载。我想要的只是加载屏幕上可见的那些图像并停留在滚动条上。屏幕上同时显示六幅图像。

是否可以在 Flatlist 中的滚动条上加载图像?

react-native react-native-flatlist

6
推荐指数
2
解决办法
9285
查看次数

如何在 React Native 中播放 vimeo 视频?

我需要在我的本机应用程序中播放 Vimeo 视频。我正在使用 webview 播放视频,视频播放但我在屏幕上看不到任何内容,音频即将到来但屏幕是空白的。下面是我的代码。是我做错了什么还是有其他方式可以玩 Vimeo?任何帮助,将不胜感激。

<AutoHeightWebView
    startInLoadingState
    style={{ width: "100%", height: '100%', borderColor: 'white', borderWidth: 2 }}
    source={{
        uri: 'https://player.vimeo.com/video/299264098?autoplay=1' //'this.state.videoUrl'
    }}
    onError={() => console.log('on error')}
    onLoad={() => console.log('on load')}
    onLoadStart={() => console.log('on load start')}
    onLoadEnd={() => console.log('on load end')}

    bounces={false}
/>
Run Code Online (Sandbox Code Playgroud)

webview vimeo-player react-native react-native-ios

3
推荐指数
2
解决办法
1万
查看次数