React Expected an assignment or function call and instead saw an expression

Question

I am trying to fix this lint error at line const def    props    gt    in following sample code   const propTypes     prop1  PropTypes string  prop2  PropTypes string  prop3  PropTypes string  prop4  PropTypes string  prop5  PropTypes string     const abc    props    gt    some code here    const def    props    gt     lt div gt   lt div className     some classes    gt  abc  lt  div gt   lt div className     some classes    gt  t  translation something    lt  div gt    lt div     gt     lt someComponent      do something     gt   if  some condition    do this   else   do that     lt  div gt        Any idea why i am getting this lint error

User · Answer

You use a function component   const def    props    gt     lt div gt   lt div className     some classes    gt  abc  lt  div gt   lt div className     some classes    gt  t  translation something    lt  div gt    lt div     gt   lt someComponent   do something   gt   if  some condition    do this   else   do that      lt  div gt        In the function component  you have to write a return or just add parentheses  After the added return or parentheses your code should look like this   const def    props    gt      lt div gt   lt div className     some classes    gt  abc  lt  div gt   lt div className     some classes    gt  t  translation something    lt  div gt    lt div     gt   lt someComponent   do something   gt   if  some condition    do this   else   do that      lt  div gt

User · Answer

Not sure about solutions but a temporary workaround is to ask eslint to ignore it by adding the following on top of the problem line     eslint-disable-next-line  typescript-eslint no-unused-expressions

User · Answer

You are not returning anything  at least from your snippet and comment   const def    props    gt     lt div gt  lt  div gt      This is not returning anything  you are wrapping the body of the arrow function with curly braces but there is no return value   const def    props    gt    return   lt div gt  lt  div gt       OR const def    props    gt   lt div gt  lt  div gt    These two solutions on the other hand are returning a valid React component  Keep also in mind that inside your jsx  as mentioned by  Adam  you can t have if     else     but only ternary operators

User · Answer

In my case the problem was the line with default instructions in switch block     handlePageChange      btnType     gt        let   page     this state      switch  btnType          case  next           this updatePage page   1           break        case  prev           this updatePage page - 1           break        default  null               Instead of   default  null    The line  default      worked for me

User · Answer

Possible way is  sure you can change array declaration to getting from db or another external resource    const MyPosts        gt       let postsRawData           id  1  text   Post 1   likesCount   1           id  2  text   Post 2   likesCount   231           id  3  text   Post 3   likesCount   547            const postsItems        for  const  key  value  of postsRawData entries          postsItems push  lt Post text  value text  likesCount  value likesCount    gt          return          lt div className  css posts  gt Posts             postsItems         lt  div gt

User · Answer

You must return something instead of this  this is not the right way  const def    props    gt     lt div gt  lt  div gt      try const def    props    gt     lt div gt  lt  div gt      or use return statement const def    props    gt    return   lt div gt  lt  div gt

User · Answer

The return statements should place in one line  Or  the other option is to remove the curly brackets that bound the HTML statement   example   return posts map  post  index    gt       lt div key  index  gt         lt h3 gt  post title  lt  h3 gt         lt p gt  post body  lt  p gt       lt  div gt

User · Answer

Expected an assignment or function call and instead saw an expression   I had this similar error with this code   const mapStateToProps    state    gt        players  state     To correct all I needed to do was add parenthesis around the curved brackets  const mapStateToProps    state    gt         players  state

[reactjs] React: Expected an assignment or function call and instead saw an expression

Examples related to reactjs

Examples related to jsx