expected assignment or function call no-unused-expressions ReactJS

Question

class Game extends Component      constructor            super       this state           speed  0             firebaseInit         render           return               lt div gt           lt h1 gt The Score is  this state speed   lt  h1 gt         lt  div gt               export default Game    I am new to React and for this code its giving this error  Expected an assignment or function call and instead saw an expression  no-unused-expressions   Dont understand where getting wrong  please help

User · Answer

The error -  quot Expected an assignment or function call and instead saw an expression  no-unused-expressions quot  comes when we use curly braces i e    to return an object literal expression  In such case we can fix it with 2 options  Use the parentheses i e    Use return statement with curly braces i e     Example   const items     quot Test1 quot    quot Test2 quot    quot Test3 quot    quot Test4 quot    console log articles map item   gt     this is   item           wrong console log items map item   gt    this is   item          Option1 console log items map item   gt    return  this is   item           Option2

User · Answer

I encountered the same error  with the below code       return this state employees map  employee    gt           lt option value  employee id  gt           employee name         lt  option gt            Above issue got resolved  when I changed curly braces to parenthesis  as indicated in the below modified code snippet         return this state employees map  employee    gt               lt option value  employee id  gt               employee name             lt  option gt

User · Answer

If You re using JSX inside a function with curly braces you need to modify it to parenthesis   Wrong Code  return this props todos map  todo    gt                 lt h3 gt   todo author   lt  h3 gt                 Correct Code    Change Curly Brace To Paranthesis   change    to   gt     return this props todos map  todo    gt                 lt h3 gt   todo author   lt  h3 gt

User · Answer

For me the error occured when using map  And I didn t use the return Statement inside the map     cart map  cart products index    gt         lt span gt  cart products id  lt  span gt           Above code produced error    cart map  cart products index    gt        return   lt span gt  cart products id  lt  span gt            Simply adding return solved it

User · Answer

In my case I had curly braces where it should have been parentheses   const Button        gt         lt button gt Hello world lt  button gt      Where it should have been   const Button        gt         lt button gt Hello world lt  button gt      The reason for this  as explained in the MDN Docs is that an arrow function wrapped by    will return the value it wraps  so if I wanted to use curly braces I had to add the return keyword  like so   const Button        gt        return  lt button gt Hello world lt  button gt

User · Answer

Instead of    return        lt div gt       lt h1 gt The Score is  this state speed   lt  h1 gt     lt  div gt       Use Below Code   return      lt div gt        lt h1 gt The Score is  this state speed   lt  h1 gt      lt  div gt        Basically use brace     in the same line of return like  return    It will fix this issue  Thanks

User · Answer

In my case I have got this error  because used a call inside of the condition without a semicolon     private async  setActive active  boolean        if  this isActive     active          return            this isActive   active       this isActive   this  start     this  stop          I changed it  and the error has gone     private async  setActive active  boolean        if  this isActive     active          return            this isActive   active       if  this isActive          await this  start          else         this  stop

User · Answer

In my case i never put return inside a arrow function  so my code is follow    lt ProductConsumer gt       myvariable   gt         return   lt h1 gt  myvariable  lt  h1 gt         lt  ProductConsumer gt

User · Answer

In case someone having a problem like i had  I was using the parenthesis with the return statement on the same line at which i had written the rest of the code  Also  i used map function and props so i got so many brackets  In this case  if you re new to React you can avoid the brackets around the props  because now everyone prefers to use the arrow functions  And in the map function you can also avoid the brackets around your function callback  props sample map function callback   gt            like so  In above code sample you can see there is only opening parenthesis at the left of the function callback

User · Answer

In my case  I got the error on the setState line   increment      this setState state   gt        count  state count   1           I changed it to this  now it works  increment      this setState state   gt        const count   state count   1      return         count

User · Answer

This happens because you put bracket of return on the next line  That might be a common mistake if you write js without semicolons and use a style where you put opened braces on the next line   Interpreter thinks that you return undefined and doesn t check your next line  That s the return operator thing   Put your opened bracket on the same line with the return

User · Answer

import React from  react    class Counter extends React Component      state             count  0              formatCount             const  count    this state             use a return statement here  it is a importent          return count     0    Zero    count            render             return             lt React Fragment gt                 lt span gt  this formatCount    lt  span gt                 lt button type  button  className  btn btn-primary  gt Increment lt  button gt             lt  React Fragment gt                      export default Counter

User · Answer

In my case the error happened because the new line after the return statement   Error   Expected an assignment or function call and instead saw an expression  return        lt ul gt                        props numbers map number   gt   lt li key  number toString    gt number lt  li gt                  lt  ul gt       Working OK  No Error  return        lt ul gt                        props numbers map number   gt   lt li key  number toString    gt number lt  li gt                  lt  ul gt

User · Answer

In my case it is happened due to curly braces of function if you use jsx then you need to change curly braces to Parentheses  see below code const  countries    useState   quot USA quot    quot UK quot    quot BD quot     I tried this but not work  don t know why    countries map  country    gt             lt MenuItem value  country  gt  country  lt  MenuItem gt          But when I change Curly Braces to parentheses and Its working fine for me     countries map  country    gt      Changes is here instead of            lt MenuItem value  country  gt  country  lt  MenuItem gt          and here instead of                  Hopefully it will help you too

[reactjs] expected assignment or function call: no-unused-expressions ReactJS

Examples related to reactjs

Examples related to jsx