博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue2
阅读量:7089 次
发布时间:2019-06-28

本文共 1543 字,大约阅读时间需要 5 分钟。

src    main.js    App.vue    store        actions.js        actions.js        index.js        mutations.js        types.js

main.js

import Vue from 'vue'import App from './App.vue'import store from './store/'new Vue({	store,	el: '#app',	render: h => h(App)})

 App.vue

 action.js

import * as types from './types'export default {	increment: ({		commit	}) => {		commit(types.INCREMENT);	},	decrement: ({		commit	}) => {		commit(types.DECREMENT);	},	clickOdd: ({		commit,		state	}) => {		if (state.mutations.count % 2 == 0) {			commit(types.INCREMENT);		}	},	clickAsync: ({		commit	}) => {		new Promise((resolve) => {			setTimeout(function() {				commit(types.INCREMENT);			}, 1000);		})	}}

 getters.js

export default {	count: (state) => {		return state.count;	},	getOdd: (state) => {		return state.count % 2 == 0 ? '偶数' : '奇数'	}}

 index.js

import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex);import mutations from './mutations'import actions from './actions'export default new Vuex.Store({	modules:{		mutations	},	actions});

 mutation.js

import {	INCREMENT,	DECREMENT} from './types'import getters from './getters'const state = {	count: 20};const mutations = {	[INCREMENT](state) {		state.count++;	},	[DECREMENT](state) {		state.count--;	}};export default {	state,	mutations,	getters}

 types.js

export const INCREMENT = 'INCREMENT';export const DECREMENT = 'DECREMENT';

 

转载地址:http://mzfql.baihongyu.com/

你可能感兴趣的文章
webpack.config.js
查看>>
iostat 命令详解
查看>>
[charles petzold]windows程序设计第六版
查看>>
模拟话机关闭hold功能
查看>>
用SSG做IPsec***做成近似2层连接
查看>>
Spark Catalyst 的实现分析
查看>>
Windows Azure Pack与VMware VRA 对比(三)VRA角色简介及基础配置
查看>>
vue设置页面滚动
查看>>
HP刀片服务器系统Flex-10 VC配置与VMware vSphere网络设计
查看>>
《D3.js数据可视化实战手册》即将上市!
查看>>
用Nginx配置https加密站点
查看>>
Sersync数据同步
查看>>
hsrp+track
查看>>
Spring mvc 在一个定时器类里实现多个定时器任务
查看>>
Window下打开并读取文件的方法
查看>>
[讨论]UI层到底使用哪种类?
查看>>
使用JIRA搭建企业问题跟踪系统-1
查看>>
电脑族适合的花草茶
查看>>
saltstack知识点2
查看>>
Jenkins Pipeline
查看>>