關于React-Router4.0跳轉不置頂解決方案

DC_er 發布于2019-08-26 13:43 / 2795人閱讀

摘要：在使用時會遇到奇怪的問題，比如當我們從首頁進入詳情頁的時候，首頁跳轉到詳情頁，首頁滾動的位置，進入到詳情頁的時候也會被記錄下來，原因是由于共享了同一個，所以對記錄有所保留，這顯然不符合我們的瀏覽習慣。總結種解決方案方案一方案二

在使用react-router時會遇到奇怪的問題，比如當我們從首頁進入詳情頁的時候，首頁跳轉到詳情頁，首頁滾動的位置，進入到詳情頁的時候也會被記錄下來，原因是由于共享了同一個history，所以對記錄有所保留，這顯然不符合我們的瀏覽習慣。

總結種解決方案：

方案一

window.scrollTo(0, 0)} history={hashHistory}>

方案二

class Protol extends React.Component {

constructor(props) {
    super(props);
}
 componentDidUpdate(prevProps) {
     if (this.props.location !== prevProps.location) {
         window.scrollTo(0, 0)
     }
 }
render() {
    return (
        
            

            {this.props.children}
            
        
    );
}

}

云服務器 GPU云服務器 asp中跳轉不正常解決首頁跳轉 react-router react-router4

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/109383.html

從路由原理出發，深入閱讀理解react-router 4.0的源碼

摘要：通過前端路由可以實現單頁應用本文首先從前端路由的原理出發，詳細介紹了前端路由原理的變遷。接著從的源碼出發，深入理解是如何實現前端路由的。執行上述的賦值后，頁面的發生改變。 ??react-router等前端路由的原理大致相同，可以實現無刷新的條件下切換顯示不同的頁面。路由的本質就是頁面的URL發生改變時，頁面的顯示結果可以根據URL的變化而變化，但是頁面不會刷新。通過前端路由可以實現...

Miyang 2019-08-23 12:01 評論0 收藏0
todo-list 項目問題總結（使用 react 進行開發）

摘要：項目問題總結這個項目，很簡單，前端使用，后端使用進行開發。方便移動端開發。當動畫結束后，有一個鉤子函數可以使用其他一些功能組件，都是自己嘗試去編寫的，像日歷組件組件組件等。版本的，是沒有任何的鉤子函數，我就感覺懵逼了。。。 todo-list 項目問題總結這個 todo-list 項目，很簡單，前端使用 react，后端 nodejs 使用 koa2 進行開發。數據庫使用 Mysql...

shengguo 2019-08-22 15:37 評論0 收藏0
使用react-router4.0實現重定向和404功能

摘要：原文地址在開發中，重定向和這種需求非常常見，使用可以使用進行重定向最常用的就是用戶登錄之后自動跳轉主頁。原文地址:https://github.com/huruji/blog/issues/2 在開發中，重定向和404這種需求非常常見，使用React-router4.0可以使用Redirect進行重定向最常用的就是用戶登錄之后自動跳轉主頁。 import React, { Compo...

hqman 2019-08-20 18:57 評論0 收藏0
手挽手帶你學React：三檔 React-router4.x的使用

摘要：我們在內部來渲染不同的組件我們這里采用哈希路由的方式，鑒于的渲染機制，我們需要把值綁定進入內部。手挽手帶你學React入門三檔,帶你學會使用Reacr-router4.x,開始創建屬于你的React項目什么是React-router React Router 是一個基于 React 之上的強大路由庫，它可以讓你向應用中快速地添加視圖和數據流，同時保持頁面與 URL 間的同步。通俗一...

SunZhaopeng 2019-08-23 15:11 評論0 收藏0