store

       const getters = {
  token: state => state.user.token,
  userAvatar: state => state.user.userAvatar,
  userProfile: state => state.user.userProfile
}
    

mutation

      const mutations = {
  SET_TOKEN: (state, token) => {
    state.token = token
  },
  SET_PROFILE: (state, userProfile) => {
    state.userProfile = userProfile
  },
  SET_AVATAR: (state, userAvatar) => {
    state.userAvatar = userAvatar
  },
}
    

action

      const action = {
    updateInfo({ commit, state }, data) {
    const { profile, avatar } = data
    return new Promise((resolve, reject) => {
      changeProfile({
        userProfile: profile,
        userAvatar: avatar
      }, state.token).then(res => {
        const { userProfile, userAvatar } = res.data
        if (res.code !== 0) {
          reject('请求参数错误')
        }
        commit('SET_PROFILE', userProfile)
        commit('SET_AVATAR', userAvatar)
        resolve()
      }).catch(error => {
        reject(error)
      })
    })
  },
}
    

组件内使用

      updateUserInfo() {
  this.$store.dispatch('user/updateInfo', this.form).then(() => {
    this.$message({
      message: '修改成功',
      type: 'success',
      duration: 5 * 1000
    })
    this.dialogFormVisible = false
    this.flag = !this.flag
    this.form.profile = ''
  })
}
    

声明

作者: liyao

版权:本博客所有文章除特别声明外,均采用CCBY-NC-SA4.O许可协议。转载请注明!

最后更新于 2026-02-17 19:36 history