vue开发项目引入vuex

对于vuex的意义不啰嗦的讲 一句话:存储公共变量的地方  

那么在实际项目开发中是怎么引入的呢?跟我们在文档上的有何区别呢?

在官方文档上,一般demo是写在vm实例文件上的,而实际开发中,保持文件作用的统一性我们通常新建一个新的文件或者文件夹来盛放我们的功能代码,比如说我们的路由模块

第一步:先下载vuex

npm install vuex --save

第二步:

在main文件中引入使用

import store from './store/index.js'

import Vuex from 'vuex'

Vue.use(Vuex)

在实例中挂载

vue开发项目引入vuex_第1张图片

第三部:建文件

vue开发项目引入vuex_第2张图片

 第4部:写在文件中引入

vue开发项目引入vuex_第3张图片

使用方法:

state相当于 组件中的data 里面存储变量

mutations:相当于methods 是一些数据的处理方法

getters:相当于过滤器

在组件中使用state的方法同router相似

使用:this.$store.state.变量名  就可以获取 与赋值

在插值表达式中{{ $store.state.变量名 }}

 

你可能感兴趣的:(vue开发项目引入vuex)