10 examples of 'react router history state' in JavaScript

13
getState() {
14
  const path = window.location.pathname;
15
  return path ? path : '/';
16
}

182
function getState() {
183
    return routerState
184
}

4
export default function router(state, action) {
5
  if (action.type !== 'ROUTER') {
6
    if (state) {
7
      return state;
8
    } else {
9
      return {
10
        // default content
11
        routerStack: [HomeContent],
12
        canPop: false,
13
      };
14
    }
15
  }
16
  let newState = Object.assign({}, state);
17
  switch (action.state) {
18
    case 'PUSH':
19
      for (let i = 0;i < newState.routerStack.length;i++) {
20
        if (newState.routerStack[i] == action.payload) {
21
          let t = newState.routerStack[i];
22
          newState.routerStack[i] = newState.routerStack[newState.routerStack.length - 1];
23
          newState.routerStack[newState.routerStack.length - 1] = t;
24
          return newState;
25
        }
26
      }
27
      newState.routerStack.push(action.payload);
28
      if (newState.routerStack.length > 1) {
29
        newState.canPop = true;
30
      }
31
      return newState;
32
    case 'POP':
33
      if (newState.routerStack.length > 1) {
34
        newState.routerStack.pop();
35
      }
36
      if (newState.routerStack.length > 1) {
37
        newState.canPop = true;
38
      } else {
39
        newState.canPop = false;
40
      }
41
      return newState;
42
    default:
43
      return newState;
44
  }
45
}

5
export function useHistory() {
6
    let pathname = getPathname();
7
    let [state, setState] = useState({ pathname });
8
9
    useEffect(() => {
10
        function handler() {
11
            let pathname = getPathname();
12
            setState(state =>
13
                state.pathname != pathname ? { pathname } : state
14
            );
15
        }
16
        return subscribe(handler);
17
    }, []);
18
    return [pathname, redirect];
19
}

9
export default function Router() {
10
  const [current, setCurrent] = useState('home')
11
  useEffect(() => {
12
    setRoute()
13
    window.addEventListener('hashchange', setRoute)
14
    return () =>  window.removeEventListener('hashchange', setRoute)
15
  }, [])
16
  function setRoute() {
17
    const location = window.location.href.split('/')
18
    const pathname = location[location.length-1]
19
    console.log('pathname: ', pathname)
20
    setCurrent(pathname ? pathname : 'home')
21
  }
22
  return (
23
    
24
      <nav>
25
      
26
        
27
        
28
        
29
        
30
      
31
    </nav>
32
  )
33
}

39
getPath(): string {
40
    return this.CURRENT_PATH;
41
}

92
static getDerivedStateFromProps({ match, resolver, matchContext }, state) {
93
  if (state.isInitialRender) {
94
    return { isInitialRender: false };
95
  }
96
97
  if (
98
    match !== state.match ||
99
    resolver !== state.resolver ||
100
    !isEqual(matchContext, state.matchContext)
101
  ) {
102
    return {
103
      match,
104
      resolver,
105
      matchContext,
106
      iteration: state.iteration + 1,
107
    };
108
  }
109
110
  return null;
111
}

17
function useRoutes(createHistory) {
18
  warning(
19
    false,
20
    '`useRoutes` is deprecated. Please use `createTransitionManager` instead.'
21
  )
22
23
  return function ({ routes, ...options } = {}) {
24
    const history = useQueries(createHistory)(options)
25
    const transitionManager = createTransitionManager(history, routes)
26
    return { ...history, ...transitionManager }
27
  }
28
}

21
function useRoutes(createHistory) {
22
  process.env.NODE_ENV !== 'production' ? warning(false, '`useRoutes` is deprecated. Please use `createTransitionManager` instead.') : void 0;
23
24
  return function () {
25
    var _ref = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
26
27
    var routes = _ref.routes;
28
29
    var options = _objectWithoutProperties(_ref, ['routes']);
30
31
    var history = useQueries(createHistory)(options);
32
    var transitionManager = createTransitionManager(history, routes);
33
    return _extends({}, history, transitionManager);
34
  };
35
}

7
export function Router({ children }) {
8
	let [pathname] = useHistory();
9
	let nextChild;
10
	let nextParams;
11
12
	children = useMemo(() => toList(children), [children]);
13
14
	let length = children.length;
15
16
	for (let i = 0; i < length; i++) {
17
		let child = children[i];
18
		let props = child.props;
19
		if (props.path) {
20
			let [inRoute, params] = match(child.props.path, pathname);
21
			if (inRoute) {
22
				nextChild = child;
23
				nextParams = params;
24
				break;
25
			}
26
		}
27
		if (child.props.default) {
28
			nextChild = child;
29
		}
30
	}
31
32
	if (nextChild) {
33
		let { type, props } = nextChild;
34
		let nextProps = { ...props, params: nextParams };
35
		delete nextProps.path;
36
		delete nextProps.default;
37
		return createElement(type, nextProps);
38
	}
39
}