Question

我想知道为什么在5秒钟后将其重定向到空白白页而不是我想要的页面。我已经返回了该函数，但是我想它实际上没有用。有人能帮我吗？

import React from 'react'
import styled from 'react-emotion'
import { Redirect } from 'react-router-dom'

class ErrorPage extends React.Component {
  state = {
    redirect: false
  }

  componentDidMount() {
    this.timeoutHandle = setTimeout(() => {
      this.setState({
        redirect: true
      })
    }, 5000)
  }

  renderRedirect = () => {
    if (this.state.redirect === true) {
      return <Redirect to="https://www.google.com/" />
    }
  }

  render() {
    return (
      <ErrorContainer>
        {this.renderRedirect()}
        <ErrorText>Page Not Found</ErrorText>
        <ErrorBox>
          <ErrorDesc>We are sorry, but the page you are looking for does not exist</ErrorDesc>
        </ErrorBox>
      </ErrorContainer>
    )
  }
}
export default ErrorPage

Answer 1

如果使用React Router组件，则必须使用路由器可以理解的路由进行重定向，这意味着所有路由都必须位于同一应用程序内，并且不能为外部链接。如果您使用外部链接进行重定向，则该链接将添加到您的网址中，例如：

http://localhost:1234/https://www.google.com/

它不起作用。

路由应该是相对的，例如'/home'或类似的东西。

遵循official docs

中的准则

重定向

如果您只想重定向到外部链接，则可以设置新的窗口位置：

window.location = 'https://www.google.com';

赞：

componentDidMount() {
    setTimeout(() => {
      window.location = 'https://www.google.com';
    }, 5000)
  }

无需保持renderRedirect()功能或redirect状态

在React中重定向不起作用

1 个答案: