client-link
The official repository of the webcomponent client-link
client-link
Client-link is a simple webcomponent for client side routing.
The component uses the history api to update the url and dispatches the pathchanged
event whenever the element is clicked.
It also adds the active
class to itself when the url matches the path specified.
Installation
npm install client-link
or yarn add client-link
Usage
Note: the recommended way of using client-link is together with client-route.
html
<script src="node_modules/client-link/index.js"></script>
<client-link to="/"> Home </client-route>
<client-link to="/about"> About </client-route>
listening for pathchanged events
window.addEventListener("pathchanged", _ => {
console.log(window.location.pathname);
})
Attributes
to
The url gets set to the path of the to
attribute whenever the element is clicked.
<client-route to="/"></client-route>
Contributing
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -am 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D
License
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Dependencies
- Released
- 2018-10-05
- Maturity
- IMPORTED
- License
- ISC License
Compatibility
- Framework
- Browser
- Browser Independent