Question

大家好，新年快乐！

我正在尝试为我的应用找到解决方案：https://www.fable.chat/home

当我单击产品页面上的后退按钮时，我想防止重新渲染主页。离开并重新进入时，首页应保持相同的滚动高度。此刻，无论何时更改URL，它都会重新呈现。我正在使用Redux和React-Router的Browserhistory。

这是我的 App.js 的呈现：

 render() {
return (
  <div >
                <div>
                    <Router history={history}>
      <div>

        <Route path="/" exact strict component={WelcomePage} />

        <Route path="/home" exact strict component={Homepage}/>


                <Route path="/register" exact strict component={RegisterPage}/>
                  <PrivateRoute path="/profile" exact strict component={Profile}/>
                      <Route path="/fableselect" exact strict component=
                            <Route path="/bots/:id" exact strict component={ProductPage}/>



      </div>
    </Router>
        </div>
        {this.state.showInstallMessage &&
        <IosSnackbar />
        }
    </div>
);
}

这是我的 history.js ：

        import { createBrowserHistory } from 'history';

        export const history = createBrowserHistory();

这是我在产品页面中的后退按钮：

              <IconButton

                style={{outline: 'none', color: '#000'}}
                onClick={history.goBack}
              >
                <BackIcon />
              </IconButton>

当我使用history.goBack（）时，我不希望我的主页再次加载所有元素，而是应该显示相同的元素，就像当我离开页面并且不重新渲染时一样。

感谢您的帮助！

亲切的问候

Reactjs ||反应路由器||在history.goBack（）时防止重新呈现

0 个答案: