- React Router Quick Start Guide
- Sagar Ganatra
- 409字
- 2021-07-23 16:41:34
History
React-Router has a dependency on the history package. history is a JavaScript library used in maintaining sessions in any JavaScript application. Consider the following quote from history’s documentation (https://github.com/ReactTraining/history):
The history object has several properties and methods:
- action: The current action, PUSH, POP, or REPLACE
- length: The count of entries in the history stack
- location: The current location, which includes the hash, pathname, search, and state properties
- hash: Hash fragment
- pathname: URL path
- search: URL query string
- state: The state information provided when navigating from one route to the other using location.pushState
- block(): A function that registers a prompt message that will be displayed when the user tries to navigate away from the current page.
- createHref(): A function that constructs a URL segment; it accepts an object with the pathname, search, and hash properties.
- go(n): A function that navigates through the history stack. history.go(-1) moves the pointer back by one position and history.go(1) moves the pointer forward by one position in the history stack.
- goBack(): A function that navigates the pointer back by one position in the history stack; the same as history.go(-1).
- goForward(): A function that navigates the pointer forward by one position in the history stack; the same as history.go(1).
- listen(listenerFn): A function that registers a listener function that gets called whenever there's a change in history.location.
- push(path, state?): A function that navigates to the given pathname, adding an entry to the history stack. It optionally accepts a state parameter, which can be used to pass application state data.
- replace(path, state?): A function that navigates to the given pathname, replacing the current entry in the history stack. It also accepts an optional state parameter.
The history object is used by React-Router internally to update the entries in the history stack when the user tries to navigate between pages. It's provided to the rendered component as a prop so that the user can be navigated to different pages using the aforementioned methods in the history object. In the next chapter, we will take a look at various APIs provided by React-Router that help you navigate to different routes defined in the application.
- Vue 3移動Web開發(fā)與性能調(diào)優(yōu)實戰(zhàn)
- Vue.js設(shè)計與實現(xiàn)
- JavaScript從入門到精通(微視頻精編版)
- 企業(yè)級Java EE架構(gòu)設(shè)計精深實踐
- TypeScript圖形渲染實戰(zhàn):基于WebGL的3D架構(gòu)與實現(xiàn)
- Learning ELK Stack
- C語言程序設(shè)計同步訓(xùn)練與上機指導(dǎo)(第三版)
- 微服務(wù)架構(gòu)深度解析:原理、實踐與進階
- Building Microservices with .NET Core
- SSM開發(fā)實戰(zhàn)教程(Spring+Spring MVC+MyBatis)
- 編寫高質(zhì)量代碼:改善Objective-C程序的61個建議
- JBoss:Developer's Guide
- 區(qū)塊鏈架構(gòu)之美:從比特幣、以太坊、超級賬本看區(qū)塊鏈架構(gòu)設(shè)計
- UI動效設(shè)計從入門到精通
- TypeScript全棧開發(fā)