Question

我可以通过路由成功地从Home组件转到TacoTypes组件。但是，我苦苦挣扎的是使用浏览器后退按钮从TacoTypes组件到Home组件进行路由。

/ChooseTruck是我尝试从TacoTypes组件导航回去的路径名。

我已经阅读了文档，并尝试按照它进行操作，但它无法正常工作。我该如何做到这一点？

import React, { Component } from 'react';
import { Link, Route } from 'react-router-dom';
import Home from '../../components/Home/Home';

import Aux from '../../hoc/Aux';

class TacoTypes extends Component {
    render() {
        return (
            <Aux>
                <Link to={{pathname: '/ChooseTruck'}} />
                <Route path="/" exact component={Home} />
            </Aux>
        );
    }
}

export default TacoTypes;

Answer 1

首先，您可以使用Fragment组件而不是制作Aux。概念很简单，它实际上与Aux相同，但是它是内置的，您可以立即使用它。了解更多here

现在让我们解决您的问题。为什么您的路径是/ChooseTruck？我不太明白。当您想使用Link组件导航回首页时，只需按照/组件下方的路径创建路径Route。此外，当您只想使用后退浏览器按钮时，请使用它。

react-router-dom正在堆积路径，因此，当您导航到TacoTypes组件并想要返回到先前的URL时，只需单击浏览器按钮，或使用withRouter hoc获得了goBack()方法，该方法也可以导航到先前的URL。

如何使用带有路由的浏览器后退按钮返回组件？

1 个答案: