https://github.com/marwan-at-work/vecty-router
A declarative client-side router for Vecty applications.
https://github.com/marwan-at-work/vecty-router
go gopherjs router vecty
Last synced: 3 months ago
JSON representation
A declarative client-side router for Vecty applications.
- Host: GitHub
- URL: https://github.com/marwan-at-work/vecty-router
- Owner: marwan-at-work
- License: apache-2.0
- Created: 2017-07-09T13:46:11.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2020-11-04T06:25:11.000Z (over 4 years ago)
- Last Synced: 2025-03-22T12:24:44.822Z (3 months ago)
- Topics: go, gopherjs, router, vecty
- Language: Go
- Size: 19.5 KB
- Stars: 28
- Watchers: 4
- Forks: 7
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Vecty Router
A declarative client-side router for [Vecty](https://www.github.com/hexops/vecty) applications.
Similar to [react-router v4](https://github.com/ReactTraining/react-router)
### Installation
`go get marwan.io/vecty-router`
### Usage
You don't need to declare your routes at the top level. You can declare them inside any component
and if they match they will render, otherwise, router will render an empty div instead.
```go
package components
import (
"github.com/hexops/vecty"
"github.com/hexops/vecty/elem"
"marwan.io/vecty-router"
)
// Body renders the tag
type Body struct {
vecty.Core
}
// Render renders the tag with the App as its children
func (b *Body) Render() vecty.ComponentOrHTML {
return elem.Body(
router.NewRoute("/", &MainView{}, router.NewRouteOpts{ExactMatch: true}),
router.NewRoute("/blog", &Blog{}, router.NewRouteOpts{}),
router.NewRoute("/blog/{id}", &PostView{}, router.NewRouteOpts{ExactMatch: true}),
)
}
```
To retrieve a named variable like {id} in the example above you can do
```go
// Render returns every title
func (pv *PostView) Render() vecty.ComponentOrHTML {
id := router.GetNamedVar(pv)["id"]
return elem.Div(
vecty.Text(id),
)
}
```
### Other features
##### Navigation through links
```go
func (c *component) Render() vecty.ComponentOrHTML {
return elem.Span(
router.Link("/my/route", "click here", router.LinkOptions{}),
)
}
```
##### Programatically navigate to a route
```go
router.Redirect("/my/route")
```
### Status
Currently vecty-router does not fallback to hash routing if the History API is not on your browser.
It also calls vecty.Rerender on all routes whenever a route changes. It should/will do its own deducing of whether to call rerender on a route or not based on route matches and whether it's already mounted or not.
### Alternatives
- https://github.com/go-humble/router