TypeError：undefined不是一個對象 - reactjs

Question

我正在一個小項目的組件上運行一些測試，並且我一直得到一個組件的錯誤。當我運行該項目時，一切按預期運行，但是當我測試時我無法擺脫這個TypeError: undefined is not an object(this.props.searchResults.map)。我對此感到困惑，因爲如我所說，它運行良好。這是我寫測試的方式的問題，還是我的代碼中有錯誤？該組件是如下：

class Results extends React.Component { 
render(){ 
    const { handleEvent, searchResults } = this.props; 
    return(
     <ul className="the-list"> 
      {this.props.searchResults.map((result, idx) => 
       <ResultItem 
        key={`${result.trackId}-${idx}`} 
        trackName={result.trackName} 
        track={result} 
        handleClick={handleEvent} /> 
       )}; 
     </ul> 
    ); 
    } 
} 

Answer 1

我認爲這可能是因爲你忘了構造

class Results extends React.Component { 

    constructor(props) { 
    super(props); 
    } 


render(){ 
    const { handleEvent, searchResults } = this.props; 
    return(
     <ul className="the-list"> 
      {this.props.searchResults.map((result, idx) => 
       <ResultItem 
        key={`${result.trackId}-${idx}`} 
        trackName={result.trackName} 
        track={result} 
        handleClick={handleEvent} /> 
       )}; 
     </ul> 
    ); 
    } 
} 

Answer 2

好像this.props.searchResults在您的測試不確定的。有兩個選項：

1：定義searchResults默認道具：

Results.defaultProps = { 
    searchResults: [] 
} 

2：定義SearchResult所測試中的：

<Results searchResults={[]} />