Compare commits
12 Commits
dev
...
testrebase
| Author | SHA1 | Date | |
|---|---|---|---|
| 6c599bd5b5 | |||
| 0aa6d2b650 | |||
| 9dac635585 | |||
| 77e1158f8b | |||
| d893b41c0b | |||
| d8bb6ddda4 | |||
| 3794916e17 | |||
| 62a4e4cb82 | |||
| c8eacd96c9 | |||
| e8cce09f51 | |||
| 1b5f17423d | |||
| 137c41c25b |
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "vuex_demo1_1",
|
||||
"name": "vuex_demo1",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
<!--moguyun-->
|
||||
<template>
|
||||
<div>
|
||||
<h3>当前最新的count值为:{{$store.state.count}}</h3>
|
||||
<h3>当前最新的count值为:{{$store.state.countOptions.count}}</h3>
|
||||
<button @click="addcount">+1</button>
|
||||
<button @click="btnhandle">+1 Async</button>
|
||||
<button @click="btnhandle1">+5 Async</button>
|
||||
<h3>{{$store.getters.showNum}}</h3>
|
||||
<h3>{{$store.getters['countOptions/showNum']}}</h3>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -18,16 +18,17 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
addcount(){
|
||||
this.$store.commit('add')
|
||||
this.$store.commit('countOptions/add')
|
||||
},
|
||||
//异步让count自增1
|
||||
btnhandle(){
|
||||
//dispatch函数专门用来触发action
|
||||
this.$store.dispatch('addAsync')
|
||||
this.$store.dispatch('countOptions/addAsync')
|
||||
},
|
||||
btnhandle1(){
|
||||
this.$store.dispatch('addNAsync',5)
|
||||
this.$store.dispatch('countOptions/addNAsync',5)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,20 +1,24 @@
|
||||
<template>
|
||||
<div>
|
||||
这是box组件,测试,test
|
||||
<div>这是box组件,测试,test</div>
|
||||
<button @click="divide(2)">除2</button>
|
||||
<div>count的值为:{{count}}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {mapState} from 'vuex'
|
||||
export default {
|
||||
data(){
|
||||
return{ }
|
||||
},
|
||||
methods:{
|
||||
|
||||
divide(num){
|
||||
this.$store.commit('countOptions/divide',num)
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
|
||||
...mapState('countOptions',['count'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -16,12 +16,12 @@ export default {
|
||||
return{ }
|
||||
},
|
||||
methods:{
|
||||
...mapMutations(['subN','xc']),
|
||||
...mapActions(['subNAsync']),
|
||||
...mapMutations('countOptions',['subN','xc']),
|
||||
...mapActions('countOptions',['subNAsync']),
|
||||
},
|
||||
computed:{
|
||||
...mapState(['count']),
|
||||
...mapGetters(['showNum','showNum1'])
|
||||
...mapState('countOptions',['count']),
|
||||
...mapGetters('countOptions',['showNum','showNum1'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
55
vuex_demo1/src/store/count.js
Normal file
55
vuex_demo1/src/store/count.js
Normal file
@@ -0,0 +1,55 @@
|
||||
export default {
|
||||
namespaced: true,
|
||||
state: {
|
||||
//存放全局共享数据
|
||||
count:0
|
||||
},
|
||||
getters: {
|
||||
showNum(state){
|
||||
let newcount = state.count *2
|
||||
return '测试getters,更新的数量为count*2: '+ newcount
|
||||
},
|
||||
showNum1(state){
|
||||
let newcount = state.count *3
|
||||
return '测试getters,更新的数量为为count*3: '+ newcount
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
//变更store中的数据
|
||||
add(state){
|
||||
state.count++
|
||||
},
|
||||
addN(state,step){
|
||||
state.count+=step
|
||||
},
|
||||
sub(state){
|
||||
state.count--
|
||||
},
|
||||
subN(state,step){
|
||||
state.count-=step
|
||||
},
|
||||
xc(state,step){
|
||||
state.count=state.count * step
|
||||
},
|
||||
divide(state,num){
|
||||
state.count = state.count / num
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
addAsync(context){
|
||||
setTimeout(()=>{
|
||||
context.commit('add')
|
||||
},1000)
|
||||
},
|
||||
addNAsync(context,step){
|
||||
setTimeout(()=>{
|
||||
context.commit('addN',step)
|
||||
},1000)
|
||||
},
|
||||
subNAsync(context,step){
|
||||
setTimeout(()=>{
|
||||
context.commit('subN',step)
|
||||
},1000)
|
||||
}
|
||||
},
|
||||
}
|
||||
@@ -2,58 +2,11 @@
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
|
||||
import countOptions from '@/store/count'
|
||||
Vue.use(Vuex)
|
||||
|
||||
export default new Vuex.Store({
|
||||
state: {
|
||||
//存放全局共享数据
|
||||
count:0
|
||||
},
|
||||
getters: {
|
||||
showNum(state){
|
||||
let newcount = state.count *2
|
||||
return '测试getters,更新的数量为count*2: '+ newcount
|
||||
},
|
||||
showNum1(state){
|
||||
let newcount = state.count *3
|
||||
return '测试getters,更新的数量为为count*3: '+ newcount
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
//变更store中的数据
|
||||
add(state){
|
||||
state.count++
|
||||
},
|
||||
addN(state,step){
|
||||
state.count+=step
|
||||
},
|
||||
sub(state){
|
||||
state.count--
|
||||
},
|
||||
subN(state,step){
|
||||
state.count-=step
|
||||
},
|
||||
xc(state,step){
|
||||
state.count=state.count * step
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
addAsync(context){
|
||||
setTimeout(()=>{
|
||||
context.commit('add')
|
||||
},1000)
|
||||
},
|
||||
addNAsync(context,step){
|
||||
setTimeout(()=>{
|
||||
context.commit('addN',step)
|
||||
},1000)
|
||||
},
|
||||
subNAsync(context,step){
|
||||
setTimeout(()=>{
|
||||
context.commit('subN',step)
|
||||
},1000)
|
||||
}
|
||||
},
|
||||
modules: {
|
||||
countOptions
|
||||
}
|
||||
})
|
||||
|
||||
4
vuex_demo1/test.md
Normal file
4
vuex_demo1/test.md
Normal file
@@ -0,0 +1,4 @@
|
||||
a
|
||||
b
|
||||
c
|
||||
d
|
||||
@@ -1,2 +1,4 @@
|
||||
测试远程dev分支
|
||||
主分支修改
|
||||
测试合并
|
||||
update dev
|
||||
|
||||
Reference in New Issue
Block a user