React render return statements with () vs return with nothing

Asked Feb 24 '20 at 01:51

Active Feb 24 '20 at 01:51

Viewed 21 times

I have a question regarding the difference between

import React from 'react';
import Container from 'react-bootstrap/Container';

class Home extends React.Component {
    render() {
        return (
        <div>
          <Container></Container>
        </div>
        )
      }
};

export default Home

and

import React from 'react';
import Container from 'react-bootstrap/Container';

class Home extends React.Component {
    render() {
        return 
        <div>
          <Container></Container>
        </div>

      }
};

export default Home

Note the parentheses after return, if I don't have the parentheses I get a compile error

asked Feb 24 '20 at 01:51

nuxer

Second method has an unused JSX expression after the `return` – CertainPerformance Feb 24 '20 at 01:52
I'm not sure what that means exactly, what is an unused JSX expression? – nuxer Feb 24 '20 at 01:53
An unused expression (though this time it's in JSX syntax). In the second snippet, you're returning `undefined` immediately – CertainPerformance Feb 24 '20 at 01:55

React render return statements with () vs return with nothing

0 Answers0