mapGetters, mapState
时间: 2023-11-22 17:42:48 浏览: 40
mapGetters和mapState是VueX库中的两个辅助函数,用于在Vue组件中访问和使用Vuex的状态和计算属性。
mapGetters函数用于将Vuex的getters映射到组件的计算属性上。通过使用mapGetters函数,我们可以在组件中直接访问和使用Vuex的getters,而无需手动引入和使用store对象。使用mapGetters函数的语法如下:
```javascript
import { mapGetters } from 'vuex';
export default {
// ...
computed: {
...mapGetters([
'getterName1',
'getterName2',
// ...
]),
},
};
```
mapState函数用于将Vuex的state映射到组件的计算属性上。通过使用mapState函数,我们可以在组件中直接访问和使用Vuex的state,而无需手动引入和使用store对象。使用mapState函数的语法如下:
```javascript
import { mapState } from 'vuex';
export default {
// ...
computed: {
...mapState([
'stateName1',
'stateName2',
// ...
]),
},
};
```
注意事项:
- 使用mapGetters和mapState函数时,需要确保已经在Vue组件中安装了Vuex。
- 在计算属性中使用mapGetters和mapState时,返回的计算属性将会自动响应状态的变化。
- mapGetters和mapState函数可以接受一个数组或对象,可以映射多个状态或计算属性。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)