v2.0.0-alpha.11GitHub RepoNPM Package
This package enables you to use Curi alongside VueJS.
For more information on using Curi with Vue, please check out the Vue guide.
UMD scripts script are also available through Unpkg. You can access the package's exports using
What does the plugin do?
curi-blockcomponents with Vue so they can be used anywhere within your application without manually importing.
- Makes the Curi router globally available to Vue components as
- Makes responses and navigations available to components through the
$curiis responsive, so when a new response is emitted,
$curi.navigationwill automatically be updated.
curi-link component will render an anchor (
name - The name of the route to navigate to. This is required.
params - An object containing the key-value params for the route. For example, if you are linking to a route with the path
album/:title, the params object should have a
hash - the hash for the location to link to
query - the query for the location to link to
state- the state to associated with the location
curi-link's can take either a regular slot or a scoped slot.
When given a scoped slot, the
curi-link will inject the link's navigation state (a
navigating property). The navigation state is
false by default,
true when the
curi-link is clicked, and
false when the the navigation finishes/is cancelled.
curi-focus directive is used to specify an element that should be focused when a new response is emitted.
The DOM component that gets the ref should either already be "focusable", like an
<input>, or be given a
tabIndex prop (usually with the value of
-1). If neither of these conditions is met, then the document's
<body> will be focused.
The focused element will have an outline (the exact style varies by browser). You can remove this visual with a CSS outline of
A value that changes when there is a new response; the
response is usually fine for this.
false by default), the element will not be focused if one of its children elements is already focused.
This is useful if the element has children that are automatically focused (
false by default), the element will not be scrolled to when it is focused.
This only works in browsers that support the
preventScroll option for