CODEWITHSUNDEEP
typescriptreact-native
PRSHL
PRSHL

Reputation: 1444

Unexpected Token, expected ';' in React Native constructor

When i want to add the constructor in my React Native Project, i always end up with Unexpected token, expected ";" (6:28).

I already tried to add semicolons in every possible location but cannot figure out whats actually the problem, because i am new to TypeScript and React Native.

export default function App() {

  constructor(props: Props) {
    super(props);

    this.state = {
      welcomeText: 'Hey this is not working'
    };
  }

  return (
    <View style={styles.container}>
      <View style={styles.subContainer}>

      </View>
      <View style={styles.subContainer}>
        <Text style={text.header}>Welcome</Text>
        <Text style={text.onBoardingContent}>

        </Text>
      </View>
    </View>
  );
}

...

SyntaxError: /Users/XXXXX/Desktop/XXXXX/Project/XXXXX/App.tsx: Unexpected token, expected ";" (6:28)

  4 | export default function App() {
  5 |
> 6 |   constructor(props: Props) {
    |                             ^
  7 |     super(props);

  8 |
  9 |     this.state = {
Failed building JavaScript bundle.

Upvotes: 0

Views: 2236

Answers (1)

Iman Rb
Iman Rb

Reputation: 797

You are using a functional component. Functions do not have a constructor in es6. You should use a class component instead. It would look something like this:

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = { myState: false };
  }
render() {
      return <h1>Class component.</h1>;
    }
}

Upvotes: 11

Related Questions