vue.js - プロパティの変更時に Vue が更新されない

Question

これを含むインデックス コンポーネントがあります。

<template>
  <ul class="nav navbar-nav navbar-right">
    <li v-if="state.user"><a @click.stop="do_logout" v-link="{ path: '/'}">Logout {{ state.user.display_name }}</a></li>
    <li v-else v-link-active><a v-link="{ path: '/login' }">Login</a></li>
  </ul>
  <router-view></router-view>
<template>

<script>

import state from '../state';
import { logout } from '../actions';

export default {
  data() {
    return {
      state
    };
  },
  methods: {
    do_logout() {
      logout().then(() => this.$router.go('/'));
    }
  }
}

</script>

そして、次のようなログイン コンポーネントがあります。

<template>
  <form class="form-signin" @submit.prevent="do_login">
    <input type="email" v-model="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
    <input type="password" v-model="password" id="inputPassword" class="form-control" placeholder="Password" required>
    <button class="btn btn-lg btn-primary btn-block" type="submit">Sign In</button>
  </form>
</template>

<script>

import { login } from '../../actions';

export default {
  data() {
    return {
      email: '',
      password: ''
    };
  },
  methods: {
    do_login() {
      login(this.email, this.password).then(() => this.$router.go('/'));
    }
  }
}

</script>

ログインとログアウトの方法は次のようになります。

import state from './state';

export const login = (email, pwd) => {
  return fetch_post_json('/api/login', {
    email,
    pwd
  }).then(j => state.user = j.user);
};

export const logout = () => _fetch('/api/logout', 'GET', null, false).then(() => state.user = null);

ログアウトは正常に機能します。リンクをクリックすると、テキストが変更され、「ログイン」リンクが表示されます。ログインは、Javascript でのログインには成功しますが、リンクは更新されません。ページを正しく表示するには、ページをリロードする必要があります。なんで？