vuex-persistedstate不支持vuex辅助函数吗
时间: 2023-07-04 14:31:00 浏览: 101
vuex-persistedstate是支持vuex辅助函数的。你可以在使用vuex辅助函数的地方添加@Persist注解来实现持久化存储。
例如,在store目录下的index.js文件中:
```
import {Persist} from 'vuex-persistedstate'
const state = {
count: 0
}
const mutations = {
increment (state) {
state.count++
}
}
const actions = {
increment ({commit}) {
commit('increment')
}
}
export default {
state,
mutations,
actions,
plugins: [Persist('count')]
}
```
在以上代码中,通过@Persist('count')表示count属性需要进行持久化存储。而在组件中使用辅助函数mapState、mapMutations、mapActions时,依然可以按照正常的方式进行使用。
例如,在组件中使用mapState辅助函数:
```
<template>
<div>
<p>Count: {{count}}</p>
<button @click="increment">Increment</button>
</div>
</template>
<script>
import {mapState, mapActions} from 'vuex'
export default {
computed: {
...mapState(['count'])
},
methods: {
...mapActions(['increment'])
}
}
</script>
```
在以上代码中,通过mapState(['count'])将count属性映射到组件的计算属性中,而通过mapActions(['increment'])将increment方法映射到组件的方法中。这些映射依然可以正常工作,同时count属性和increment方法也都会进行持久化存储。
阅读全文