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

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

1：为searchResults定义默认道具：

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

TypeError：undefined不是对象 - reactjs

2 个答案: