2023年3月29日 加入方法形式

src/views/site/index.vue

@@ -1,15 +1,29 @@
 <template>
-  <div>
-    {{ state }}
-    <a-button type="error" @click="() => state.count++">点击+1</a-button>
-    <a-button type="error" @click="() => i++">点击+1</a-button>
-
-    <RouterLink to="/site/index2">跳转到子页</RouterLink>
-  </div>
+  <a-card>
+    <div>
+      <h1>首页</h1>
+    </div>
+    <div>
+      {{ state }}
+      <a-button type="primary" @click="() => state.count++">点击+1</a-button>
+    </div>
+    <div>
+      {{ i }}
+      <a-button type="primary" @click="changeClick">点击+1</a-button>
+    </div>
+    <div>
+      <RouterLink to="/site/index2">跳转到子页</RouterLink>
+    </div>
+  </a-card>
 </template>
 
 <script lang="ts" setup>
   import { ref } from 'vue';
+  // reactive
   const state = ref({ count: 0 });
-  const i = ref(1);
+  let i = ref(1);
+
+  function changeClick() {
+    i.value++;
+  }
 </script>