history

import { createBrowserHistory, createHashHistory, createMemoryHistory } from 'history'; // Create a browser history instance for web applications const browserHistory = createBrowserHistory(); console.log('Initial browser history location:', browserHistory.location.pathname); // Listen for changes in the history stack browserHistory.listen(({ location, action }) => { console.log(`Browser history changed: ${action} to ${location.pathname}${location.search}${location.hash}`); }); // Navigate to a new path with state browserHistory.push('/about', { from: 'home' }); // Replace the current entry in the history stack browserHistory.replace('/contact'); // Create a hash history instance (for environments where server-side routing is not possible) const hashHistory = createHashHistory(); console.log('Initial hash history location:', hashHistory.location.pathname); hashHistory.push('/#/settings'); // Create a memory history instance (useful for testing or server-side rendering) const memoryHistory = createMemoryHistory({ initialEntries: ['/', '/dashboard'] }); memoryHistory.go(-1); console.log('Memory history location:', memoryHistory.location.pathname); // Example of blocking navigation using `history.block` const unblock = browserHistory.block((tx) => { console.warn(`Blocking navigation attempt to ${tx.location.pathname}.`); // To proceed with the navigation, uncomment tx.retry(); // tx.retry(); // Returning false or nothing cancels the navigation. return false; }); // Attempt to navigate, which will be blocked by the above listener browserHistory.push('/secret-page'); // Clean up the blocker after a timeout for demonstration setTimeout(() => { unblock(); // Remove the navigation blocker console.log('Navigation blocker removed. Subsequent navigations will proceed.'); browserHistory.push('/allowed-page'); // This navigation will now succeed }, 2000);