materio-d8/web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue

<template lang="html">
  <div id="user-tools">
    <h4>{{ mail }}</h4>
    <a href="/user/logout"
      @click.prevent="onLogout()"
    >
      logout
    </a>
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex'

export default {
  // data () {
  //   return {
  //     mail: "Hello User!"
  //   }
  // },
  computed: {
    ...mapState({
      mail: state => state.User.mail
    })
  },
  methods: {
    ...mapActions({
      userLogout: 'User/userLogout'
    }),
    onLogout () {
      this.userLogout()
    }
  }
}
</script>

<style lang="css" scoped>
</style>