React報錯資訊之Expected an assignment or function call and instead saw an expression

2022-08-20 14:01:51

正文從這開始~

總覽

當我們忘記從函數中返回值時，會產生"Expected an assignment or function call and instead saw an expression"錯誤。為了解決該錯誤，確保顯式地使用return語句或使用箭頭函數隱式返回。

下面有兩個範例來展示錯誤是如何產生的。

// App.js

const App = props => {
  const result = ['a', 'b', 'c'].map(el => {
    // ⛔️ Expected an assignment or function call and instead saw an expression. eslint no-unused-expressions
    el + '100';
  });

  return <div>hello world</div>;
};

const mapStateToProps = (state) => {
  // ⛔️ Expected an assignment or function call and instead saw an expression. eslint no-unused-expressions
  todos: ['walk the dog', 'buy groceries']
}

export default App;

在App元件中，錯誤是在Array.map()方法中引起的。這裡的問題在於，我們沒有從傳遞給map()方法的回撥函數中返回任意值。

在JavaScript函數中，如果我們沒有顯式地使用return語句，或者使用箭頭函數隱式地返回一個值，則返回undefined。

mapStateToProps函數中的問題是一樣的，我們忘記從函數中返回值。

顯式返回

為了解決該錯誤，我們必須顯式地使用return語句或使用箭頭函數隱式返回值。

下面是一個例子，用來說明如何使用顯式return來解決這個錯誤。

const App = props => {
  const result = ['a', 'b', 'c'].map(el => {
    return el + '100'; //

React報錯資訊之Expected an assignment or function call and instead saw an expression

目錄

正文從這開始~

總覽

顯式返回

熱門文章