Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

I keep on getting an error saying unexpected token but have no idea where that unexpected token is at? Please help

Code is below

import React from 'react';
import react, { Component } from 'react'
import { Plateform, StyleSheet, View,Text } from 'react-native';
function Header() {
  return (
    <this.View style={style}/>
    <Text style={[styles.setFontSize.setColorRed]}>Welcome to the dealership!</Text>
      <header className="header">
        <div className="col1">
        <div className="col2">
        <div className="menu">
        <h3>About</h3>
        <h3>Cars</h3>
        <h3>Contact</h3>
        <h3>Search</h3>
        <header/>
        <View/>
  

Line 37:12: Parsing error: Unexpected token, expected "}"

35 | 36 | App = StyleSheet.create({

37 | container: { | ^ 38 | flex: 1, 39 | justifyContent: 'center', 40 | alignItems: 'center'

You've incorrectly closed Header, i.e. <Header/> versus </Header>, and you dropped two closing div tags outside the header instead of in it, and the first div is missing its closing tag. I assume you don't want your view in the header, so I left it below it.

This is where using proper indentations and any decent IDE would help catch/identify these for you.

function Header() {
  return (
      <this.View style={style}/>
      <Text style={[styles.setFontSize.setColorRed]}>Welcome to the dealership!</Text>
      <header className="header">
        <div className="col1"></div>
        <div className="col2">
          <div className="menu">
            <h3>About</h3>
            <h3>Cars</h3>
            <h3>Contact</h3>
            <h3>Search</h3>
      </header>
      <View/>

You need to enclose header HTML element and then wrap the component with <div>

function Header() {
  return (
      <this.View style={style} />
      <Text style={[styles.setFontSize.setColorRed]}>
        Welcome to the dealership!
      </Text>
      <header className="header">
        <div className="col1"></div>
        <div className="col2">
          <div className="menu">
            <h3>About</h3>
            <h3>Cars</h3>
            <h3>Contact</h3>
            <h3>Search</h3>
            <header />
            <View />
      </header>

There are some really useful editor extensions can add and rename close tag for you, like Auto Close Tag and Auto Rename Tag.

Thanks for contributing an answer to Stack Overflow!

  • Please be sure to answer the question. Provide details and share your research!

But avoid

  • Asking for help, clarification, or responding to other answers.
  • Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.