如何在React Native中解决此错误RNGestureHandlerButton?

时间:2019-01-28 01:14:28

标签: reactjs react-native react-redux cross-platform react-navigation

我是React Native的新手,我在实现react-navigation时发生错误。

我在互联网上查找了此错误,但是信息很少,但是我发现该错误来自我的navigation.js文件。

我不了解错误,这是错误生成: the error RNGestureHandlerButton

Navigation.js

import {createAppContainer, createStackNavigator} from 'react-navigation'
const MainNavigator = createStackNavigator({
    login: {screen: LoginScreen},
});
const AppNavigation = createAppContainer(MainNavigator);
export default AppNavigation;

App.js

import Navigation from './src/navigators/Navigation'
import...
class App extends React.Component {
    componentDidMount() {
        this.props.checkLogin();
    }
    _renderSplash = ()=>{
        return (
            <View>
                <ActivityIndicator size="large"/>
                <Text>Loading...</Text>
            </View>
        );
    }
    _renderRoot = (authenticated)=>{
                    console.log(authenticated);
         //const NavigationRoot = Navigation(authenticated); // for later
         return  <Navigation />;  // <--- called
    }
    render() {
         const {app_started, authenticated} = this.props.authState;
         return ((app_started ? this._renderRoot(authenticated):this._renderSplash));
  }
}
const mapStateToProps = (state) => {
    return {
        authState: state.authState
    }
};
const mapDispatchToProps = (dispatch, ownProps)=>{
    return {
        async checkLogin(){
            const isLoggin = await AsyncStorage.getItem('authenticated').catch(e => console.log(e));
            if(isLoggin){
                dispatch(actionCreator(LOGIN_SUCCESS))
            }
            dispatch(actionCreator(APP_LOADED))
        }
    }
};
const Root = connect(mapStateToProps, mapDispatchToProps)(App);
const RootContainer = ()=> {
    return (
        <Provider store={configureStore}>
            <Root/>
        </Provider>
        )
};
export default RootContainer

LoginScreen.js

import ...
class LoginScreen extends React.Component{
    _login = ()=>{
        // check the fields
        let token = 'whatever';
        this.props.authSuccess(token);
    };
    render() {
        return (
            <View>
                    <TextInput.../>
                    <TextInput... onSubmitEditing={this._login}/> 
                    <Button... onPress={this._login}/>
            </View>
        );
    }
}
const mapStateToProps = (state) => {
    return state
};
export const actionCreator = (action, payload=null)=>{return{type: action, payload: payload}};

const mapDispatchToProps = (dispatch,ownProps)=>{
    return {
        authSuccess: (token)=>{
            AsyncStorage.multiSet([['token',token], ["login", '1']]);
            dispatch(actionCreator(LOGIN_SUCCESS))
        }
    }
};
const LoginRoot = connect(mapStateToProps, mapDispatchToProps)(LoginScreen);
export default LoginRoot;

package.js

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {...},
  "dependencies": {
    "@types/react": "^16.7.21",
    "email-validator": "^2.0.4",
    "expo": "^32.0.0",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    "react-native-keyboard-spacer": "^0.4.1",
    "react-navigation": "^3.0.9",
    "react-redux": "^6.0.0",
    "redux": "^4.0.1"
  },
  "devDependencies": {
    "babel-preset-expo": "^5.0.0"
  },
  "private": true
}

0 个答案:

没有答案