JavaScript

超轻量级php框架startmvc

vue实现将数据存入vuex中以及从vuex中取出数据

更新时间:2020-09-21 17:00:01 作者:startmvc
1、在store文件下面新建文件print.js,写入以下代码/***存放**数据***///initialstateconststate={all:{ID

1、在store文件下面新建文件 print.js ,写入以下代码


 /**
 * 存放 ** 数据
 * **/
 
 // initial state
 const state = {
 all: { 
 ID:'',
 BrandID:''
 }
 }
 
 // getters
 const getters = {}
 
 // actions
 const actions = {}
 
 // mutations
 const mutations = {
 setPrint(state, all) { //设置参数
 state.all = all;
 }
 }
 
 export default {
 namespaced: true,
 state,
 getters,
 actions,
 mutations
 }

注意:记得在store下面的index.js文件中引入这个文件


 import Vue from 'vue';
 import Vuex from 'vuex';
 import print from './module/print';
 const debug = process.env.NODE_ENV !== 'production';
 Vue.use(Vuex);
 export default new Vuex.Store({
 modules: {
 print
 },
 strict: debug, //开启严格模式
 plugins: debug ? [createLogger()] : []
 })

2、将数据存入vuex中(在要存入数据的页面写)


 this.$store.commit("print/setPrint", { //print 表示vuex的文件名
 ID: this.ID,
 BrandID: 402
 });

3、将数据从vuex中取出来使用(在要使用的页面写)


 import { mapState, mapActions } from "vuex";
 computed: {
 ...mapState({
 print:state=>state.print.all
 })
 }

在用到的地方直接写入以下代码即可:


 this.CreateID = this.print.ID;
 this.GoodsID = this.print.BrandID;

以上这篇vue实现将数据存入vuex中以及从vuex中取出数据就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

vue 数据 存入 vuex