Why breaks 'console.log' inside a stateless function expression?

Question

I'm sure it is just a syntax thing. How can I console.log inside a stateless function expression?

const Layer = (props) => (
  console.log(props); //breaks
)

Answer 1

There's no need to change the structure of the component to use curly braces and adding a return. You can do:

const Layer = (props) => console.log(props) || (
  ...whatever component does
);

Answer 2

const StatelessComponent = props => {
   console.log(props);
   return (
      <div>{props.whatever}</div>
   )
}

Keep in mind that in a functional components there is no render method as is. Your JSX should be written in the return section of a function. That's not the react specific case. That's the behaviour of the arrow function itself. Good luck coding :)