CODEWITHSUNDEEP
javascriptreactjsreact-native
flash
flash

Reputation: 1519

Error 'Helloworld' is not defined react/jsx-no-undef in React

I've a react code as shown below which is showing error at Line A Helloworld is not defined although its defined at Line B.

React code:

const Helloworld = (props) => {  /* Line B */
    return (
        timezones.map((timezone) => {
            <a onClick = {
                (e) => {
                    e.preventDefault();
                    props.onChange(timezone)
                }
            } > timezone < /a>
        })
    )
}


return(
    <VersionPageHolder>
        {
            <Helloworld onChange={(timezone) => {      /* Line A */     
                setSelectedTimezone(timezone);
            }}
            />
        }
        <div>{content.title}</div>
        <div>Version List : </div>
        <div>{
            renderElements(selectedTimezone)
        }</div>
    </VersionPageHolder>
)

Upvotes: 0

Views: 93

Answers (1)

Yadab
Yadab

Reputation: 1883

Its because you are not returning any value. You can do like this. You need to change bracket after timezone (timezone) => (

const Helloworld = (props) => {  /* Line B */
    return (
        timezones.map((timezone) => (
            <a onClick = {
                (e) => {
                    e.preventDefault();
                    props.onChange(timezone)
                }
            } > timezone < /a>
        ))
    )
}

Or you can do like this as well. Just return the component inside map.

const Helloworld = (props) => {  /* Line B */
    return (
        timezones.map((timezone) => {
          return (
            <a onClick = {
                (e) => {
                    e.preventDefault();
                    props.onChange(timezone)
                }
            } > timezone < /a>
          )
        })
    )
}

Upvotes: 1

Related Questions