feat : 動態路由

susu3131 · Oct 3, 2023 · b2e33cd · b2e33cd
1 parent b9b5c3d
commit b2e33cd
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 1 deletion.
diff --git a/deploy.sh b/deploy.sh
diff --git a/pages/product.vue b/pages/product.vue
@@ -1,8 +1,14 @@
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+const id = 123;
+const id2 = 456;
+</script>
 
 <template>
   <div>
     <p>product</p>
+    <nuxt-link :to="`/product/${id}`" style="margin-right: 8px">商品細節1</nuxt-link>
+    <nuxt-link :to="`/product/${id2}`">商品細節2</nuxt-link>
+    <NuxtPage />
   </div>
 </template>
 

diff --git a/pages/product/[id].vue b/pages/product/[id].vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup></script>
+
+<template>
+  <div>
+    <p>id: {{ $route.params.id }}</p>
+  </div>
+</template>
+
+<style scoped></style>