Full-Stack Web Development with Vue.js and Node

Testing an MEVN Application Chapter 9

<v-toolbar-title>Home</v-toolbar-title>

<v-spacer></v-spacer>

<v-toolbar-items class="hidden-sm-and-down">

<v-btn id="add_movie_link" flat v-bind:to="{ name: 'AddMovie' }"

v-if="current_user && current_user.role === 'admin'">

Add Movie

</v-btn>

<v-btn id="user_email" flat v-if="current_user">{{

current_user.email }}</v-btn>

<v-btn flat v-bind:to="{ name: 'Register' }" v-if="!current_user"

id="register_btn">

Register

</v-btn>

<v-btn flat v-bind:to="{ name: 'Login' }" v-if="!current_user"

id="login_btn">Login</v-btn>

<v-btn id="logout_btn" flat v-if="current_user"

@click="logout">Logout</v-btn>

</v-toolbar-items>

</v-toolbar>

<v-content>

<v-container fluid>

<div id="app">

<router-view/>

</div>

</v-container>

</v-content>

<v-footer color="indigo" app>

<span class="white--text">© 2017</span>

</v-footer>

</v-app>

</template>

<script>

import axios from 'axios';

import './assets/stylesheets/main.css';

import bus from './bus';

export default {

name: 'app',

data: () => ({

drawer: null,

current_user: null,

}),

props: {

source: String,

},

mounted() {