尝试推送新屏幕时,HostFunction中的异常:<未知>

时间:2019-05-01 16:53:33

标签: react-native react-native-android react-native-navigation wix-react-native-navigation

问题说明

尝试使用 Navigation.push(this, { component: { name: 'awesome-places.AuthScreen' }}) 并出现错误Exepction in HostFunction <unknown>

Error Screenshot

复制/代码段/屏幕截图的步骤

创建RN应用,安装必需的模块(redux,react-redux,react-native-navigation,react-vector-icons)并在Android设备上运行代码。

添加导致错误的相关代码,App.js和组件。我尝试使用this.props.componentId运行Navigation.push,但是当我按下按钮时没有响应

App.js

import { Navigation } from 'react-native-navigation';
import { Provider } from 'react-redux';

import AuthScreen from './src/screens/Auth/Auth';
import SharePlaceScreen from './src/screens/SharePlace/SharePlace';
import FindPlaceScreen from './src/screens/FindPlace/FindPlace';
import PlaceDetailScreen from './src/screens/PlaceDetail/PlaceDetail';
import configureStore from './src/store/configureStore';

const store = configureStore();

// Register Screens
Navigation.registerComponentWithRedux("awesome-places.AuthScreen", () => AuthScreen, Provider, store);
Navigation.registerComponentWithRedux("awesome-places.SharePlaceScreen", () => SharePlaceScreen, Provider, store);
Navigation.registerComponentWithRedux("awesome-places.FindPlaceScreen", () => FindPlaceScreen, Provider, store);
Navigation.registerComponent("awesome-places.PlaceDetailScreen", () => PlaceDetailScreen);

// Start an App
Navigation.events().registerAppLaunchedListener(() => {
  Navigation.setRoot({
    root: {
      component: {
        name: 'awesome-places.AuthScreen'
      }
    }
  });
});

FindPlace.js

import React, { Component } from 'react';
import { View, Text } from 'react-native';
import { connect } from 'react-redux';
import { Navigation } from 'react-native-navigation';

import PlaceList from '../../components/PlaceList/PlaceList';

class FindPlaceScreen extends Component {
        Navigation.push(this, {
            component: {
                name: 'awesome-places.AuthScreen',
            }
        })

    }

    render () {
        return(
            <View>
                <PlaceList places={this.props.places} onItemSelected={this.itemSelectedHandler} />
            </View>
        );
    }
}

const mapStateToProps = state => {
    return {
        places: state.places.places
    }
}

export default connect(mapStateToProps)(FindPlaceScreen);

环境

  • React Native Navigation版本:2.17.0
  • 原生版本:0.59.4
  • 平台(iOS,Android还是两者都使用):Android
  • 设备信息(模拟器/设备?操作系统版本?调试/发布?):Android 7.1.2,调试

1 个答案:

答案 0 :(得分:0)

我注意到您正在使用this而不是显式componentId推动屏幕。 调用Navigation.push时,第一个参数必须是componentId。参见docs for reference

这也不是问题,但是registerComponentWithRedux已过时,您应该向new api注册该屏幕