静态页面无交互完成

src/App.vue

@@ -29,6 +29,7 @@ export default {
 }
 #app{
   background-color: #f6f7fb;
+  padding-bottom: 20px;
 }
 
 </style>

src/components/menu.vue

 <template>
     <div class="menu">
         <img src="../assets/imgs/home_img_logo.png" alt="" class="logo">
-        <span class="user">用户</span>
-        <img src="../assets/imgs/home_ic_user.png" alt="" class="user_pic">
+        <div style="float:right;cursor: pointer;position:relative;" class="user_hover">
+            <span class="user">用户</span>
+            <img src="../assets/imgs/home_ic_user.png" alt="" class="user_pic">
+            <div class="user_menu">
+                <div v-for="(item,index) in user_arr" :key="index+700" @click="gotopage(index)">{{item}}</div>
+            </div>
+            <div class="sj"></div>
+        </div>
         <div class="number">99+</div>
         <img src="../assets/imgs/home_ic_shop.png" alt="" class="car">
         
@@ -22,6 +28,12 @@ export default {
         return{
             menu_arr:['工作台','技术支持','服务超市'],
             now_menu:0,
+            user_arr:['个人档案','消息通知','收银中心','关于BD-aPaaS','退出登录'],
+        }
+    },
+    methods:{
+        gotopage(n){
+            console.log(n);
         }
     }
 }
@@ -34,6 +46,7 @@ export default {
     background-color: #0f2683;
     color: #8390ee;
     line-height: 84px;
+
 }
 .logo{
     float: left;
@@ -85,4 +98,43 @@ export default {
     bottom: 0px;
     left: calc(50% - 12px);
 }
+.user_menu{
+    width: 135px;
+	background-color: #ffffff;
+	box-shadow: 0px 3px 6px 0px 
+		#f4f7fc;
+	border-radius: 8px;
+    position: absolute;
+    top: 80px;
+    left: -20px;
+    overflow: hidden;
+    display: none;
+    z-index: 1;
+}
+.user_hover:hover .user_menu{
+    display: block;
+}
+.user_hover:hover .sj{
+    display: block;
+}
+.user_menu div{
+    width: 135px;
+    height: 44px;
+    line-height: 44px;
+    text-align: center;
+    color: #0d1847;
+}
+.user_menu div:hover{
+    background-color: #e56600;
+    color: #fff;
+}
+.sj{
+    width: 16px;
+    height: 16px;
+    background-color: #e56600;
+    position: absolute;
+    top: 72px;
+    transform:rotate(45deg);
+    display: none;
+}
 </style>
\ No newline at end of file