电商项目中“退出登录”功能

实现用户退出登录功能： store/modules/user.js

const state={
  userInfo:{}
 },
const mutations={
  setUserInfo(state,obj){
    state.userInfo=obj
  }
},
const actions={
  logout(context){
  
     //实现清空用户信息，即让userInfo={}，所以调用setUserInfo来修改state中的userInfo的值
     context.commit('setUserInfo',{})
     
     //实现清空购物车信息  调用另一个模块cart.js中的修改数据的方法，来修改state中的cartList的值
     //语法： context.commit('模块名/mutations方法名',新值,{root:true} )
     
     context.commit('cart/setCartList',[],{root:true})
 }
}
       
     

store/modules/cart.js

const state={
  cartList:[]
 },
const mutations={
  setCartList(state,newList){
     state.cartList=newList
   }
 },
const actions={}

登出界面：

<button @click="logout">退出登录</>

const logout={
  //调用user模块下的异步方法logout,实现用户信息的清空以及购物车列表的清空
  
  this.$dialog.confirm({
    title:'温馨提示',
    message:'你确定要退出吗？',
    }).then(()=>{
      
      //调用user模块下的异步方法，实现用户信息的清空以及购物车列表的清空
      this.$store.dispatch('user/logout')
    }).catch(()=>{})
 }