（二十二）VueCli3.0全栈——设置顶部导航和下拉菜单

效果：

效果图

1、client/src/components下新建HeadNav.vue

2、Index.vue中引入和使用 (client/src/views/Index.vue)

3、退出登录时，设置了一个方法把vuex中存储的信息给清除掉了

在client/src/store.js中新增action方法：

//   清除当前状态
  clearCurrentState:({commit})=>{
    commit(types.SET_AUTHENTICATED,false);
    commit(types.SET_USER,null);
  }

store.js里面新增的

顶部导航和下拉菜单完成了。