CODEWITHSUNDEEP
javascriptreactjslinteslint
calebo
calebo

Reputation: 3442

Eslint arrow-body-style error in react.js

Using Airbnb's eslint rules, I'm getting the following error in my react code but I'm not sure what's the error.

const Facebook = ({ appId, url }) => {
  return (
    <div className={styles.facebook}>
      <FacebookProvider appID={appId}>
        <EmbeddedPost href={url} width="auto" />
      </FacebookProvider>
    </div>
  )
}

Getting an error at the beginning of line 1 { bracket.

Unexpected block statement surrounding arrow body. (arrow-body-style)

Tried wrapping the curly brackets with parenthesis brackets but in turn, another error appear around line 3 of <div>.

Parsing error: Unexpected token

Upvotes: 3

Views: 2875

Answers (1)

patrick
patrick

Reputation: 10273

Try removing the curly braces and the return as per the issue linked in the comment for your question:

const Facebook = ({ appId, url }) => 
    <div className={styles.facebook}>
        <FacebookProvider appID={appId}>
            <EmbeddedPost href={url} width="auto" />
        </FacebookProvider>
    </div>

Upvotes: 2

Related Questions