• vueX的使用


    vuex的使用:

       1. 下载vuex,但是在脚手架中可以直接使用.
            安装代码: npm i vuex@3.4.0 --save
        2.    新建js
            import Vue from 'vue'
            import Vuex from 'vuex'
            Vue.use(Vuex)
            let store = new Vuex.store({})
            export default store
        3.main.js
            引入 import store from ' '
            new Vue({ store  })

    vuex的五个核心概念
            state -- 存放数据的,取值: this.$store.state
            getters -- 类似于计算属性

                    语法: state:{},
                          getters:{
                                  计算属性名字(state){}
                          }
                    取值:this.$store.getters

            mutations -- 唯一一个可以修改state内数据的方法

                    语法: 
                        state:{},
                        mutations:{
                            方法名字:(state,参数){
                                //参数多的话使用对象包裹
                            }
                        }
                    调用:this.$store.commit('方法',参数)

            actions:也可以修改state内的数据,属于异步修改

                    语法:
                        state{},
                        actions:{
                            方法(store,参数){
                                store.commit()
                            }
                        }
                    调用:this.$store.dispatch()

             modules 模块化

                    模块拆分其实是拆分的存储,也就是存储的位置(state)拆分出去了;其他的(getters\mutations\actions)都没有拆分,因此容易造成命名冲突,需要我们在模块化内开启命名空间:
     modules:{
         模块名:{
             namespaced:true,
             state:{},
             getters:{}
         }
     }
     开启完命名空间后对 (getters\mutations\actions)造成的影响 名字前面
     加上了 "模块名/"
     
     使用: $store.getters['模块名/方法名']

                    

  • 相关阅读:
    win10安装spark
    鲲山科技:引入和鲸 ModelWhale,实现量化策略的高效迭代
    基于python的火车票售票系统/基于django火车票务网站/火车购票系统
    Http客户端--Feign简介
    使用Tensorflow2.0执行视觉显著性检测(Visual Saliency Detection)
    技术人必读!一文读懂数据存储!
    Softing TCS:高效的诊断模拟解决方案
    【JSP 基础】
    STP生成树协议基本配置示例---STP逻辑树产生和修改
    springboot 下 activiti 7会签配置与实现
  • 原文地址:https://blog.csdn.net/hhh067/article/details/132619558