Every line of 'react router useparams typescript' code snippets is scanned for vulnerabilities by our powerful machine learning engine that combs millions of open source libraries, ensuring your JavaScript code is secure.
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 }
38 function useParams(initialParams = {}, debounceWait = 500) { 39 const [params, setParams] = useState(initialParams); 40 const [isStale, setIsStale] = useState(false); 41 42 function updateParams(updatedParams) { 43 const newParams = { ...params, ...updatedParams }; 44 setParams(newParams); 45 } 46 47 const debouncedSetParams = useMemo( 48 () => 49 debounce(newParams => { 50 setIsStale(false); 51 setParams(newParams); 52 }, debounceWait), 53 [] 54 ); 55 56 return { 57 params, 58 isStale, 59 setParams, 60 debouncedSetParams: newParams => { 61 setIsStale(true); 62 debouncedSetParams(newParams); 63 }, 64 updateParams, 65 debouncedUpdateParams: updatedParams => { 66 setIsStale(true); 67 debouncedSetParams({ ...params, ...updatedParams }); 68 } 69 }; 70 }
8 export function Router({children, ...props}) { 9 assert(props.location, 'Router "location" property is missing') 10 11 const routes = useMemo(() => addRoutes(children), []) 12 return renderMatch(routes, props) 13 }
27 function useRoutes(routes) { 28 const [rid] = fre.useState(Math.random().toString()); 29 const setter = fre.useState(0)[1]; 30 let stackObj = stack[rid]; 31 32 if (!stackObj) { 33 stackObj = { 34 routes: Object.entries(routes), 35 setter 36 }; 37 stack[rid] = stackObj; 38 process(rid); 39 } 40 41 return typeof stackObj.component === 'function' ? stackObj.component(stackObj.props) : push(stackObj.component); 42 }
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 }
11 function withRouter(Component) { 12 const displayName = `withRouter(${Component.displayName || Component.name})`; 13 const C = props => { 14 const { wrappedComponentRef, ...remainingProps } = props; 15 16 return ( 17 18 {context => { 19 invariant( 20 context, 21 `You should not use <${displayName} /> outside a ` 22 ); 23 return ( 24 25 ); 26 }} 27 28 ); 29 }; 30 31 C.displayName = displayName; 32 C.WrappedComponent = Component; 33 34 if (__DEV__) { 35 C.propTypes = { 36 wrappedComponentRef: PropTypes.oneOfType([ 37 PropTypes.string, 38 PropTypes.func, 39 PropTypes.object 40 ]) 41 }; 42 } 43 44 return hoistStatics(C, Component); 45 }
71 route(route, params) { 72 if (this.previousRoute === route) { 73 return; 74 } 75 if (this.previousRoute) { 76 this.previousRoute.shadowRoot.innerHTML = ''; 77 } 78 if (route.page.prototype instanceof HTMLElement) { 79 const page = getName(define(route.page)); 80 this.shadowRoot.innerHTML = `<${page}>`; 81 } else if (route.page[0] === '<') { 82 this.shadowRoot.innerHTML = route.page; 83 } else { 84 this.shadowRoot.innerHTML = `<${route.page}>`; 85 } 86 if (this.shadowRoot.firstElementChild) { 87 Object.assign(this.shadowRoot.firstElementChild, params); 88 } 89 this.previousRoute = route; 90 }
4 export function useReactRouterQueryStringInterface(): QueryStringInterface | undefined { 5 const router = useRouter() 6 const history = router && router.history 7 8 if (!history) { 9 console.warn('useRouter - router was not found') 10 return 11 } 12 13 return { 14 getQueryString: () => history.location.search, 15 setQueryString: (newQueryString, { method = 'replace' }) => { 16 history[method](`${history.location.pathname}?${newQueryString}${history.location.hash}`) 17 }, 18 } 19 }
65 function Router(props, context) { 66 _classCallCheck(this, Router); 67 68 _React$Component.call(this, props, context); 69 70 this.state = { 71 location: null, 72 routes: null, 73 params: null, 74 components: null 75 }; 76 }