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


Posted in Javascript onNovember 08, 2019

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中取出数据就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS实现获取剪贴板内容的方法
Jun 21 Javascript
JavaScript排序算法动画演示效果的实现方法
Oct 18 Javascript
js控制按钮,防止频繁点击响应的实例
Feb 15 Javascript
整理关于Bootstrap过渡动画的慕课笔记
Mar 29 Javascript
JS将unicode码转中文方法
May 08 Javascript
详解vue项目优化之按需加载组件-使用webpack require.ensure
Jun 13 Javascript
理解 javascript 中的函数表达式与函数声明
Jul 07 Javascript
Vue响应式原理深入解析及注意事项
Dec 11 Javascript
jQuery判断自定义属性data-val用法示例
Jan 07 jQuery
微信小程序常用赋值方法小结
Apr 30 Javascript
小程序实现多个选项卡切换
Jun 19 Javascript
javascript实现点击按钮切换轮播图功能
Sep 23 Javascript
vue.js的简单自动求和计算实例
Nov 08 #Javascript
vue中get请求如何传递数组参数的方法示例
Nov 08 #Javascript
Vue搭建后台系统需要注意的问题
Nov 08 #Javascript
vue视频播放暂停代码
Nov 08 #Javascript
vue-dplayer 视频播放器实例代码
Nov 08 #Javascript
BootstrapValidator实现表单验证功能
Nov 08 #Javascript
vue项目中定义全局变量、函数的几种方法
Nov 08 #Javascript
You might like
叶罗丽:为什么大家对颜冰这对CP非常关心,却对金茉两人十分冷漠
2020/03/17 国漫
js静态作用域的功能。
2006/12/25 Javascript
JavaScript 学习笔记(十二) dom
2010/01/21 Javascript
JavaScript建立一个语法高亮输入框实现思路
2013/02/26 Javascript
Javascript全局变量var与不var的区别深入解析
2013/12/09 Javascript
js实现三张图(文)片一起切换的banner焦点图
2015/08/25 Javascript
基于JavaScript实现移除(删除)数组中指定元素
2016/01/04 Javascript
javascript稀疏数组(sparse array)和密集数组用法分析
2016/12/28 Javascript
Vue组件tree实现树形菜单
2017/04/13 Javascript
JS去掉字符串前后空格、阻止表单提交的实现代码
2017/06/08 Javascript
解决vue组件中使用v-for出现告警问题及v for指令介绍
2017/11/11 Javascript
前端js中的事件循环eventloop机制详解
2019/05/15 Javascript
解决layui表格的表头不滚动的问题
2019/09/04 Javascript
Vue.js数字输入框组件使用方法详解
2019/10/19 Javascript
JS常见内存泄漏及解决方案解析
2020/05/30 Javascript
bootstrap-closable-tab可实现关闭的tab标签页插件
2020/08/09 Javascript
Python设计足球联赛赛程表程序的思路与简单实现示例
2016/06/28 Python
对Python字符串中的换行符和制表符介绍
2018/05/03 Python
python 调用钉钉机器人的方法
2019/02/20 Python
python的set处理二维数组转一维数组的方法示例
2019/05/31 Python
Python 把序列转换为元组的函数tuple方法
2019/06/27 Python
pytorch中的卷积和池化计算方式详解
2020/01/03 Python
给Django Admin添加验证码和多次登录尝试限制的实现
2020/07/26 Python
英国知名的皮手套品牌:Dents
2016/11/13 全球购物
Skyscanner阿联酋:全球领先的旅游搜索平台
2017/11/25 全球购物
Notino法国:购买香水和化妆品
2019/04/15 全球购物
意大利香水和化妆品购物网站:Parfimo.it
2019/10/06 全球购物
营销专业应届生求职信
2013/11/26 职场文书
新学期家长寄语
2014/01/19 职场文书
预备党员2014全国两会学习心得体会
2014/03/10 职场文书
机械加工与数控专业自荐书
2014/06/04 职场文书
人民调解协议书范本
2014/10/11 职场文书
班主任培训研修日志
2015/11/13 职场文书
简述python四种分词工具,盘点哪个更好用?
2021/04/13 Python
关于antd tree 和父子组件之间的传值问题(react 总结)
2021/06/02 Javascript
MongoDB误操作后使用oplog恢复数据
2022/04/11 MongoDB