zoukankan      html  css  js  c++  java
  • Vuex

    vuex是什么?

    怎么使用?

    哪种功能场景使用它?


    1、读取的公共状态集中放在store中; 改变store状态的方式是提交mutations,这是个同步的事物; 异步逻辑应该封装在action中。


    2、在main.js引入store,注入。新建了一个目录store,….. ,export 。


    3、场景有:单页应用中,组件之间的状态、音乐播放、登录状态、购物车

    状态树 state

        Vuex 使用单一状态树,即每个应用将仅仅包含一个store 实例,但单一状态树和模块化并不冲突。存放的数据状态,不可以直接修改里面的数据。


    同步操作 mutations

        mutations定义的方法动态修改Vuex 的 store 中的状态或数据。


    getters

         类似vue的计算属性,主要用来过滤一些数据。


    action 

         actions可以理解为通过将mutations里面处里数据的方法变成可异步的处理数据的方法,简单的说就是异步操作数据。

    view 层通过 store.dispath 来分发 action。 ??

    // store示例

    const store = new Vuex.Store({ 
      state: {
         count: 0
      },
      mutations: { 
        increment (state) {
          state.count++
        }
      },
      actions: { 
        increment (context) {
           context.commit('increment')
        }
      }
    })

    modules

          项目特别复杂的时候,可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰,方便管理。

     const moduleA = {
          state: { ... },
          mutations: { ... },
          actions: { ... },
          getters: { ... }
     }
    
    const moduleB
    = { state: { ... }, mutations: { ... }, actions: { ... } } const store = new Vuex.Store({ modules: { a: moduleA, b: moduleB })
    未完,待续......
  • 相关阅读:
    博客写作技巧及规范
    2020年中总结
    运维笔记(一)——磁盘挂载与逻辑卷扩容
    mysql设计与优化(二)——配置主从
    mysql设计与优化(一)
    日志处理(一)
    坑爹问题—360自动填充账户密码
    mysql设计与优化
    java并发-ConcurrentMap
    FastDfs配置nginx
  • 原文地址:https://www.cnblogs.com/zhishiyv/p/12130869.html
Copyright © 2011-2022 走看看