evaluating 'this.props = props' React Native

Asked

Viewed 203 times

0

I am learning React Activate and I am having a hard time. I am following this tutorial: https://blog.logrocket.com/navigating-react-native-apps-using-react-navigation/

I perform all the same procedure but it doesn’t work. I get this error every time I run my app

inserir a descrição da imagem aqui

My Homescreen:

import React, { Component } from 'react';
import { Button, View, Text } from 'react-native';
import { createStackNavigator, createAppContainer } from 'react-navigation';


export default class HomeScreen extends Component{
  render(){
    return(
        <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
          <Text> Home Screen </Text>
            <Button
              title="Sobre"
              onPress={() => this.props.navigation.navigate('About')}
            />
        </View>
    )
  }
}

My App.js

import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createStackNavigator, createAppContainer } from 'react-navigation';

import HomeScreen from './components/HomeScreen';
import AboutScreen from './components/AboutScreen';

export default class App extends Component() {
  render(){
    return <AppContainer/>
  }
}

const AppNavigator = createStackNavigator({
  Home: {
    screen: HomeScreen
  },
  About: {
    screen: AboutScreen
  }
},{
    initialRouteName: 'Home'
});

const AppContainer = createAppContainer(AppNavigator);

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Versions I am using:

"expo": "^33.0.0",
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
"react-native-web": "^0.11.4",
"react-navigation": "^3.11.1"

I’m using expo to emulate my app

1 answer

1


your own error message points to line 8 Voce has: export default class App extends Component(), change to export default class App extends React.Component

if it doesn’t work, make sure that prop navigation is coming to the component with componentDidMount()

  • It wasn’t quite that, but my class I was calling Component() {, correct is just Component {

Browser other questions tagged

You are not signed in. Login or sign up in order to post.