unexpected token using stateless function in react

Question

Trying to avoid extends of Component as the component merely render data, it can be standalone.

const CountDown = () => {
    render(){
        return(
            <p>Countdown.jsx</p>
        )
    }
}

module.exports = Countdown

But what's wrong? I got unexpected token at render(){ ... }

I down voted because you didn't show any research where you tried to fix this on your own. — whs.bsmith, Jun 27 '17 at 13:38

score 7 · Accepted Answer · edited Sep 24 '17 at 16:18

Stateless functional components don't have the render() method... in fact they don't have any methods because they are a method themselves.

Try instead:

const CountDown = () => {
  return(
    <p>Countdown.jsx</p>
  )
}

module.exports = Countdown

or even:

const CountDown = () => <p>Countdown.jsx</p>
module.exports = Countdown

As a side-note, you might find this post interesting. It's an in-depth explanation of stateless functional components.

1 Answers1