From b068f90f0e9775e25e2c1b5dac9610df9a5bcead Mon Sep 17 00:00:00 2001
From: yutent <yutent.io@gmail.com>
Date: Sun, 13 Aug 2023 23:20:02 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0router-link?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/hash-router.js |  2 ++
 src/router/index.js       | 35 ++++++++++++++++++++++++++++++++++-
 2 files changed, 36 insertions(+), 1 deletion(-)

diff --git a/src/router/hash-router.js b/src/router/hash-router.js
index 78312ab..9ba9141 100644
--- a/src/router/hash-router.js
+++ b/src/router/hash-router.js
@@ -19,6 +19,8 @@ const RULE_REGEXP =
   /(:id)|(\{id\})|(\{id:([A-z\d\,\[\]\{\}\-\+\*\?\!:\^\$]*)\})/g
 
 class Router {
+  type = 'hash'
+
   #tables = new Map()
   #views = new Set()
 
diff --git a/src/router/index.js b/src/router/index.js
index 1600ad8..16b8979 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -79,8 +79,41 @@ class RouterView extends Component {
 }
 
 class RouterLink extends Component {
+  static props = {
+    to: Object,
+    disabled: false
+  }
+
+  static styles = css`
+    :host {
+      display: inline-flex;
+    }
+    a {
+      color: inherit;
+      text-decoration: inherit;
+      cursor: pointer;
+    }
+
+    :host([disabled]) a {
+      opacity: 0.6;
+      cursor: not-allowed;
+    }
+  `
+
+  #navigate() {
+    let type = this.$router.type
+    if (this.disabled) {
+      return
+    }
+    if (type === 'hash') {
+      //
+    } else {
+      //
+    }
+  }
+
   render() {
-    return html`<a class="link"><slot></slot></a>`
+    return html`<a @click=${this.#navigate}> <slot></slot></a>`
   }
 }