基于组件的 vue 动态路由 (模仿react-router4)

时间:2021-1-8 作者:admin

### [](#components)Components

## [](#router)`Router`

Router acts as a provider to the various other components, or any other component which is decorated with `withRouter`, passing down the current location, and history object. It expects a location object, which has an API similar to `window.location` and a history object, with an API similar to `window.history` to be passed in as props.

## [](#historyrouter)`HistoryRouter`

A component which passes the browser's history and location (via the `history` module on npm) to Router. This is what you will want to use (in a browser).

## [](#route)`Route`

Take's two props, `path` and `exact`. Path takes an express style route (which is based on [path-to-regexp](/go/?target=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fpath-to-regexp)), and if the browser's location matches that path, it will show the content. The content can either be a a component, or a scopedSlot. They will be passed the router parameters, the path that matched (useful for nesting routes), and the current url (useful for building nested links), either as props, or as parameters, respectively.

Passing in `exact` as true will make the route match exactly.

{{id}} {{path}} {{url}}

“`

RouterLink

Takes three props, to, activeClass (defaults to ‘active’) and tag (defaults to a). This will render a link tag which knows how to update the location, and will set an active class when the route matches the link.

MatchFirst

Expects a list of Routes as slots, and will render the first one that matches.

Redirect

Takes a prop to, and will cause the browser to redirect to that url

withRouter

A HOC which will inject the wrapped function and inject the router object, which contains the history and location objects

withHandleClick

A HOC that takes a component or tag, and returns a component that handles clicks similar to RouterLink. This enables using other components or tags as router links without `

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。