我正在使用 Jest 和 Enzyme 来测试 React 功能组件。
我的组件:
export const getGroups = async () => {
const data = await fetch(groupApiUrl);
return await data.json()
};
export default function MyWidget({
groupId,
}) {
// Store group object in state
const [group, setGroup] = useState(null);
// Retrive groups on load
useEffect(() => {
if (groupId && group === null) {
const runEffect = async () => {
const { groups } = await getGroups();
const groupData = groups.find(
g => g.name === …Run Code Online (Sandbox Code Playgroud) 大家.
在发生异步调用后,我遇到了测试状态更新的奇怪问题componentDidMount.
这是我的组件代码:
'use strict';
import React from 'react';
import UserComponent from './userComponent';
const request = require('request');
class UsersListComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
usersList: []
};
}
componentDidMount() {
request('https://api.github.com/users', (err, res) => {
if (!err && res.statusCode === 200) {
this.setState({
usersList: res.slice(0)
});
}
else {
console.log(err);
}
});
}
render() {
if (!this.state.usersList.length) {
return null;
}
return (
<div className="users-list">
{ this._constructUsersList() }
</div>
);
}
_constructUsersList() {
return …Run Code Online (Sandbox Code Playgroud)