zoukankan      html  css  js  c++  java
  • 有关vuex的简单介绍

    首先vuex是一个专门为vue.js应用开发的状态管理模式工具,其中它的状态(state)都是响应式的

    其次vuex的安装,通过npm install vuex --save安装到开发环境下。

    注:如果是vuex4+版本--配合vue3.0安装版本,通过npm install vuex@next --save(后续介绍vuex4.+)

    关于store,直接上代码(基本方式)

    import Vue from 'vue'
    import Vuex from 'vuex'
    
    Vue.use(Vuex)
    
    const store = new Vuex.Store({
       state: {},
       getters: {},
       mutations: {},
       actions: {} 
    })

    还有一种带模块的(module),这种相对于前一种比较复杂,详细可以参考文档:https://vuex.vuejs.org/zh/

    import Vue from 'vue'
    impor Vuex from 'vuex'
    
    Vue.use(Vuex)
    
    const store = new Vuex.store({
        // 全局 state,模块内部也可以写自己的状态
        state,
        modules: {
            // 里面分别写不同的模块
        }
    })
    
    export store

    需要注意三点:

    1、vuex官方文档中说mutation是唯一改变state状态的途径。经过查资料和验证发现非严格模式下action也可以改变state的状态。

    2、action存放异步操作,mutation 都是同步事务。其实不然,mutation也可以放异步任务,尤大大也说了文档不是他翻译,之所说mutation放同步任务是为了更好的追踪状态

    3、如何直接获取mutation和action返回的参数,1)可以通过回调函数。2)通过return返回(注:通过return返回时action返回promise,mutation返回时undefined-只能通过回调函数)

  • 相关阅读:
    我常用到的前端工具
    三级菜单
    voxel安装2
    voxel安装
    Linux 安装 nginx
    pip DEPRECATION: The default format will switch to columns”错误
    Python升级安装的一些问题
    Linux下修改Apache即httpd的端口
    Linux中yum命令镜像源和出错解决方案
    Linux 别名 Apache
  • 原文地址:https://www.cnblogs.com/little-baby/p/15309848.html
Copyright © 2011-2022 走看看