Vue.js 2 Web Development Projects

Logout

First, we will implement the logout action.

1. Let's add a logout action in the posts Vuex module that clears the posts fetching data:

      logout ({ commit }) {        commit('posts', {          posts: [],          mapBounds: null,        })      },

2. We can call this from the logout action in the main store (in the store/index.js file):

      logout ({ commit, dispatch }) {        commit('user', null)        $fetch('logout')        // ...        dispatch('posts/logout')      },

This is going to work, but we can improve this code--we could define the logout action of the posts namespaced submodule as a root action. That way, when we dispatch the 'logout' action, both the logout and the posts/logout will be called!

3. Use this object notation in the posts module for the logout action:

      logout: {        handler ({ commit ...