feat(navigation): 更新底部导航栏样式

- 替换静态图片图标为 vant 组件图标
- 调整导航项的样式和结构
- 添加 activeTab 数据属性用于测试
- 注释掉部分冗余代码

src/components/Navigation/Index.vue

@@ -12,15 +12,17 @@ const navigation = ref([
       name: 'home',
       path: '/home'
     },
-    icon: '/tabbar/home.png'
+    // icon: '/tabbar/home.png',
+    icon: 'home-o',
+    inactive:''
   },
   {
     title: '伊调研',
-    link: {
-      name: 'home',
-      path: '/home'
-    },
-    icon: '/tabbar/yl.png'
+    // link: {
+    //   name: 'home',
+    //   path: '/home'
+    // },
+    // icon: '/tabbar/yl.png'
   },
   {
     title: '我的',
@@ -28,7 +30,8 @@ const navigation = ref([
       name: '',
       path: '/survey'
     },
-    icon: '/tabbar/mine.png'
+    icon:'friends-o',
+    // icon: '/tabbar/mine.png'
   }
 ]);
 
@@ -57,11 +60,13 @@ watch(activeTab, (value: string) => {
 
 <template>
   <div class="navigation">
+    {{activeTab}}
     <van-tabbar v-model="activeTab">
-      <van-tabbar-item v-for="item in navigation" :key="item.title" :name="item.title">
-        <template #icon>
-          <img :src="item.icon" />
-        </template>
+      <van-tabbar-item v-for="item in navigation"
+                       :icon="item.icon" :key="item.title" :name="item.title">
+<!--        <template #icon="props">-->
+<!--          <img :src="props.active ? icon.icon : icon.inactive" />-->
+<!--        </template>-->
         {{ item.title }}
       </van-tabbar-item>
     </van-tabbar>