美文网首页
vueX modules的使用

vueX modules的使用

作者: 魔仙堡杠把子灬 | 来源:发表于2020-04-28 11:01 被阅读0次

    我一直以为最伤心的一句话是我不爱你,没想到更伤心的是对不起我忘不了他!

    前端QQ群: 981668406
    在此附上我的QQ: 2489757828 有问题的话可以一同探讨
    我的github: 李大玄
    我的私人博客: 李大玄
    我的简书: 李大玄
    我的CSDN: 李大玄
    咱们这篇文章就重点讲一下modules的使用 vueX的使用看我这篇文章
    简书地址
    CSDN地址
    首先咱们要了解,每一个modules下的方法名不可以一样,如果没有开启命名空间的话,会有问题, 所以咱们每一个modules都需要加一个参数 namespaced: true
    官网地址

    1. 首先创建项目中store目录 modules咱们就使模块化的使用 一个模块一个modules, 外层的就是全局的 谁想用都可以
      在这里插入图片描述
    1. 咱们建立第一个modules, 就拿login来说吧
      定义和普通没有区别,但是使用的时候就会有去呗
    import { saveStorage } from '../cache'
    
    const state = {
      num: '',
    }
    const getters = {
      num: (state) => state.num,
    }
    const mutations = {
      SET_NUM(state, data) {
        state.num = data
      },
    }
    const actions = {
      setNum: ({ commit }, num) => {
        commit('SET_NUM', num)
        saveStorage('num', num)
      },
    }
    export default {
      namespaced: true, // 此为开启命名空间 每个modules 都需要
      state,
      getters,
      actions,
      mutations,
    }
    

    此为设置参数


    在这里插入图片描述

    怎么获取呢,接着往下看,

    没几行代码,自己敲一下

    在这里插入图片描述

    然后看最最关键 index文件

    在这里插入图片描述

    是不是感觉特别简单呢

    相关文章

      网友评论

          本文标题:vueX modules的使用

          本文链接:https://www.haomeiwen.com/subject/upfvwhtx.html