为什么Axios无法使用eslint一致的回报？

Question

考虑以下代码（教科书Axios get函数），renderRedirect始终会触发一致返回错误。我相信我已经探索了Axios的所有代码路径。

class Dashboard extends Component {

  renderRedirect = () => {
    const user = JSON.parse(sessionStorage.getItem('user'));
    if (user === null) {
      console.log('in');
      axios.get('/user')
        .then((response) => {
          console.log(response.data);
          sessionStorage.setItem('user', JSON.stringify(response.data));
          if (response.data.type === 'investor') {
            console.log('go to startups'); // LINE 17
            return <Redirect to="/startups" />;
          }
          console.log('go to investors');
          return <Redirect to="/investors" />;
        })
        .catch(() => {
          console.log('go to investors');
          return <Redirect to="/investors" />;
        });
    } else if (user.type === 'investor') {
      console.log('go to startups');  // LINE 28
      return <Redirect to="/startups" />;
    } else {
      console.log('go to investors');
      return <Redirect to="/investors" />;
    }
  };

  render() {
    return (
      <div>
        {this.renderRedirect()}
      </div>
    );
  }
}

export default withRouter(Dashboard);

为什么？

[另外，看着控制台，我注意到第17行和第28行都在被调用。这里有我想念的东西吗？

谢谢

Answer 1

在您的分支if (user === null)中，您没有返回任何内容，因为axios.get(...)是您的最后一条语句。

由于axios.get将返回Promise，因此您将无法像React一样在期望同步结果的渲染方法中说return axios.get。

[在这种情况下，应使用状态（useState钩子或使用setState），并将状态设置为在通过axios提取时加载，完成后，将状态设置为所获得的结果（和返回重定向而不是加载程序。

类似这样的东西：

const Dashboard = () => {
  const [redirect, setRedirect] = useState(null);
  useEffect(() => {
    const user = JSON.parse(sessionStorage.getItem('user'));
    if (user === null) {
      console.log('in');
      axios.get('/user')
        .then((response) => {
          console.log(response.data);
          sessionStorage.setItem('user', JSON.stringify(response.data));
          if (response.data.type === 'investor') {
            console.log('go to startups'); // LINE 17
            setRedirect("/startups");
          }
          console.log('go to investors');
          setRedirect("/investors");
        })
        .catch(() => {
          console.log('go to investors');
          setRedirect("/investors");
        });
    } else if (user.type === 'investor') {
      console.log('go to startups');  // LINE 28
      setRedirect("/startups");
    } else {
      console.log('go to investors');
      setRedirect("/investors");
    }
  }, []);
  return (
    <div>{redirect === null ? "Loading user.type" : <Redirect to={redirect} />}</div>
  );
}