AIgod_shixi_vue/components/AppHeader.vue

<template>
  <!-- 公共头 -->
  <header id="header">
    <section class="container">
      <h1 id="logo">
        <a href="#" title="AI 小财神">
          <img src="~/assets/img/logo.png" width="80%" height="80%" alt="AI 小财神">
        </a>
      </h1>
      <div class="h-r-nsl">
        <ul class="nav">
          <router-link to="/home" tag="li" active-class="current" style="font-weight: bold;">
            <a>主页</a>
          </router-link>
          <router-link to="/club" tag="li" active-class="current" style="font-weight: bold;">
            <a>博股俱乐部</a>
          </router-link>
          <router-link to="/" tag="li" active-class="current" exact style="font-weight: bold;">
            <a>直播广场</a>
          </router-link>

        </ul>
      </div>
      <aside class="mw-nav-btn">
        <div class="mw-nav-icon"/>
      </aside>
      <div class="clear"/>
    </section>
  </header>
  <!-- /公共头 -->
</template>
<script>
import loginApi from '~/api/login'
import cookie from 'js-cookie'
export default{
  data() {
    return {
      userInfo: null
    }
  },
  // 登录成功后获取用户信息
  created() {
    this.getUserInfo()
  },
  // 页面渲染之后执行
  mounted() {
    const token = this.$route.query.token
    if (token) {
      cookie.set('guli_jwt_token', token, { domain: 'localhost' })
      window.location.href = '/'
    }
  },

  methods: {

    getUserInfo() {
      // cookie中token值不存在
      if (!cookie.get('guli_jwt_token')) {
        return
      }
      loginApi.getLoginInfo().then(response => {
        this.userInfo = response.data.userInfo
      })
    },
    logout() {
    // 清除cookie
      cookie.set('guli_jwt_token', '', { domain: 'localhost' })
      window.location.href = '/'
    }
  }

}
</script>