Question

TypeError：未定义不是一个对象 - reactjs

2017-07-08

2882

reactjs

我正在对一个小项目的组件进行一些测试，但一个组件一直出现相同的错误。当我运行项目时，一切都按预期运行，但是当我测试时，我无法摆脱这个 TypeError：undefined 不是对象（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

似乎 this.props.searchResults 在您的测试中未定义。这里有两个选项：

1：为 searchResults 定义一个默认 prop：

Results.defaultProps = {
    searchResults: []
}

2：在您的测试中定义 searchResults：

<Results searchResults={[]} />

Answer 2

我认为可能是因为你忘记了构造函数

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>
    );
  }
}