@viewfly/router 3.0.1 → 3.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.en.md ADDED
@@ -0,0 +1,80 @@
1
+ # @viewfly/router
2
+
3
+ **Languages:** [简体中文](./README.md)
4
+
5
+ Browser routing for **Viewfly**: declarative links, nested outlets, programmatic navigation. Requires **`@viewfly/core`** and **`@viewfly/platform-browser`**.
6
+
7
+ ---
8
+
9
+ ## Install
10
+
11
+ ```bash
12
+ npm install @viewfly/router @viewfly/platform-browser @viewfly/core
13
+ ```
14
+
15
+ ---
16
+
17
+ ## Wiring into the app
18
+
19
+ 1. Register **`RouterModule`** at app level (`createApp(...).use(...)`).
20
+ 2. Use **`Link`** for nav and **`RouterOutlet`** to render the matched view.
21
+ 3. **`inject(Router)`** inside components, then **`navigateTo(path, queryParams?, hash?)`** / **`replaceTo`** — the second argument is the **query object** (distinct from path **`Router.params`** / **`useParams()`**).
22
+
23
+ Minimal sketch (extend with your route table, lazy loading, etc.):
24
+
25
+ ```tsx
26
+ import { inject } from '@viewfly/core'
27
+ import { createApp } from '@viewfly/platform-browser'
28
+ import { Link, Router, RouterModule, RouterOutlet } from '@viewfly/router'
29
+
30
+ function Home() {
31
+ const router = inject(Router)
32
+ return () => (
33
+ <div>
34
+ <p>Home</p>
35
+ <button type="button" onClick={() => router.navigateTo('/list')}>Go to list</button>
36
+ </div>
37
+ )
38
+ }
39
+
40
+ function List() {
41
+ return () => <div>List</div>
42
+ }
43
+
44
+ function App() {
45
+ return () => (
46
+ <div>
47
+ <nav>
48
+ <Link active="active" exact to="/">Home</Link>
49
+ <Link active="active" to="/list">List</Link>
50
+ </nav>
51
+ <RouterOutlet>
52
+ No route matched
53
+ </RouterOutlet>
54
+ </div>
55
+ )
56
+ }
57
+
58
+ createApp(<App/>).use(new RouterModule({
59
+ routes: [
60
+ { path: '', component: Home },
61
+ { path: 'list', component: List }
62
+ ]
63
+ })).mount(document.querySelector('#main')!)
64
+
65
+ ```
66
+
67
+ **Nested routes:** place another `RouterOutlet` in child layouts and pass nested route config.
68
+
69
+ ---
70
+
71
+ ## Docs
72
+
73
+ - Official docs: <https://viewfly.org/guide/router>
74
+ - **`@viewfly/router`** typings.
75
+
76
+ ---
77
+
78
+ ## License
79
+
80
+ MIT
package/README.md CHANGED
@@ -1,5 +1,7 @@
1
1
  # @viewfly/router
2
2
 
3
+ **Languages:** [English](./README.en.md)
4
+
3
5
  基于 **Viewfly** 的浏览器端路由:声明式链接、嵌套路由出口、编程式导航等。需配合 **`@viewfly/core`** 与 **`@viewfly/platform-browser`** 使用。
4
6
 
5
7
  ---
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@viewfly/router",
3
- "version": "3.0.1",
3
+ "version": "3.0.3",
4
4
  "description": "A routing library based on the Viewfly framework that can be run in the browser or Nodejs background.",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.esm.js",
@@ -19,7 +19,7 @@
19
19
  "keywords": [],
20
20
  "dependencies": {
21
21
  "@tanbo/stream": "^1.2.4",
22
- "@viewfly/core": "^3.0.1",
22
+ "@viewfly/core": "^3.0.3",
23
23
  "url": "^0.11.4"
24
24
  },
25
25
  "devDependencies": {