有人可以用实际例子解释一下 jest.fn()
是如何工作的吗?我很困惑它该如何使用和在哪里使用。
例如,如果我有一个组件 Countries,在按钮点击时借助 Utils 函数获取国家列表。
export default class Countries extends React.Component {
constructor(props) {
super(props)
this.state = {
countryList:''
}
}
getList() {
//e.preventDefault();
//do an api call here
let list = getCountryList();
list.then((response)=>{ this.setState({ countryList:response }) });
}
render() {
var cListing = "Click button to load Countries List";
if(this.state.countryList) {
let cList = JSON.parse(this.state.countryList);
cListing = cList.RestResponse.result.map((item)=> { return(<li key={item.alpha3_code}> {item.name} </li>); });
}
return (
<div>
<button onClick={()=>this.getList()} className="buttonStyle"> Show Countries List </button>
<ul>
{cListing}
</ul>
</div>
);
}
}
使用的实用函数
const http = require('http');
export function getCountryList() {
return new Promise(resolve => {
let url = "/country/get/all";
http.get({host:'services.groupkt.com',path: url,withCredentials:false}, response => {
let data = '';
response.on('data', _data => data += _data);
response.on('end', () => resolve(data));
});
});
}
我应该在哪里使用 jest.fn()
或如何测试当我点击按钮时是否调用了 getList()
函数?
const mockFn = jest.fn(() => {});
和const mockFn = jest.fn();
是一样的吗? - Hyfyfn
,它将默认为undefined
,构造函数将接收一个长度为零的值,并且返回值始终为undefined
,这与使用箭头函数获得的效果相同。 - nascente_diskreta