vue3中使用Composition API 使用 Vuex
- Home.vue
/*
* @Descripttion: 规范自己,写出优质量代码
* @version: 1.0
* @Author: baojino
* @Date: 2021-11-01 15:38:58
* @LastEditors: Aidam_Bo
* @LastEditTime: 2021-11-01 17:46:32
*/
import { createStore } from 'vuex'
export default createStore({
state: {
name: 'dell'
},
mutations: {
changeName(state ,str) {
// this.state.name = 'chensan'
state.name = str
},
getData(state ,str) {
state.name = str
}
},
actions: {
getData() {
setTimeout(() => {
this.commit('getData','liming')
}, 2000)
},
},
modules: {
}
})
``````html
/*
* @Descripttion: 规范自己,写出优质量代码
* @version: 1.0
* @Author: baojino
* @Date: 2021-11-01 15:38:58
* @LastEditors: Aidam_Bo
* @LastEditTime: 2021-11-01 17:46:32
*/
import { createStore } from 'vuex'
export default createStore({
state: {
name: 'dell'
},
mutations: {
changeName(state ,str) {
// this.state.name = 'chensan'
state.name = str
},
getData(state ,str) {
state.name = str
}
},
actions: {
getData() {
setTimeout(() => {
this.commit('getData','liming')
}, 2000)
},
},
modules: {
}
})
``````html
/*
* @Descripttion: 规范自己,写出优质量代码
* @version: 1.0
* @Author: baojino
* @Date: 2021-11-01 15:38:58
* @LastEditors: Aidam_Bo
* @LastEditTime: 2021-11-01 17:46:32
*/
import { createStore } from 'vuex'
export default createStore({
state: {
name: 'dell'
},
mutations: {
changeName(state ,str) {
// this.state.name = 'chensan'
state.name = str
},
getData(state ,str) {
state.name = str
}
},
actions: {
getData() {
setTimeout(() => {
this.commit('getData','liming')
}, 2000)
},
},
modules: {
}
})
我的名字是:{{name}}
改变
```
- store\index.js
/*
* @Descripttion: 规范自己,写出优质量代码
* @version: 1.0
* @Author: baojino
* @Date: 2021-11-01 15:38:58
* @LastEditors: Aidam_Bo
* @LastEditTime: 2021-11-01 17:46:32
*/
import { createStore } from 'vuex'
export default createStore({
state: {
name: 'dell'
},
mutations: {
changeName(state ,str) {
// this.state.name = 'chensan'
state.name = str
},
getData(state ,str) {
state.name = str
}
},
actions: {
getData() {
setTimeout(() => {
this.commit('getData','liming')
}, 2000)
},
},
modules: {
}
})
在日常开发中使用compositionAPI 中的useStore好还是使用vuex中的State|Getter| Mutation | Action 这两种哪个跟好一些?
本作品采用《CC 协议》,转载必须注明作者和本文链接
推荐文章: