mapState的写法

mapState是Vue.js中用于将组件的状态映射到computed属性的辅助函数。它的写法通常如下：

import { mapState } from 'vuex';

export default {
  computed: {
    ...mapState({
      // 将 state 中的 count 映射为 this.count
      count: state => state.count,

      // 将 state 中的 message 映射为 this.message
      message: state => state.message
    })
  }
}

在上述代码中，我们首先从`vuex`导入`mapState`函数。然后，在`computed`属性中使用扩展运算符`...`将`mapState`返回的对象展开添加到组件的computed属性中。

`mapState`接受一个对象作为参数，该对象的属性用于指定要映射的状态字段。每个属性的值是一个函数，接受`state`作为参数并返回相应的状态值。

在上面的例子中，我们将`state`中的`count`映射为组件的`this.count`，将`state`中的`message`映射为组件的`this.message`。此后，我们就可以在组件中直接访问这些映射后的状态值了。

希望这能帮助到你！如果有任何疑问，请随时提问。

相关问题

...mapState('user',['count']) ...mapState({count=>state.user.count)) 这两种写法的区别

这两种写法都是用于在Vue组件中将Vuex状态映射到组件的计算属性中。

第一种写法 `mapState('user',['count'])` 是使用命名空间来映射状态。其中 `'user'` 是指定的命名空间名字，`['count']` 是要映射的状态名字数组。这种写法会将命名空间为 `'user'` 的Vuex模块中的 `'count'` 状态映射到组件的计算属性中。

第二种写法 `mapState({count=>state.user.count))` 是使用对象来映射状态。其中 `{count=>state.user.count}` 是一个对象字面量，键名是要映射的计算属性名字，键值是一个函数，用来返回对应的状态。这种写法会将 `state.user.count` 状态映射到组件的计算属性中，并使用 `count` 作为计算属性的名字。

总结来说，两种写法的区别在于使用命名空间还是使用对象来指定要映射的状态，并且第二种写法可以指定计算属性的名字。

mapState mapMutations 怎么用

在Vuex的Modules模式下，我们可以使用mapState和mapMutations来简化对state和mutations的操作。

使用mapState可以帮助我们在组件中获取state的值，而不需要通过this.$store.state.xxx的方式。mapState有几种不同的写法：

1. 写法一：使用数组

...mapState(['leftFocus', 'hasBg'])

这种写法可以直接将state中的leftFocus和hasBg映射到当前组件的计算属性中。

2. 写法二：使用对象

...mapState({ 'name':state=>state.user.username })

这种写法可以将state中的user模块中的username映射到当前组件的计算属性中，并命名为name。

3. 写法三：推荐写法

...mapState(user, ['data1', 'data2'])

这种写法将user模块中的data1和data2映射到当前组件的计算属性中。

使用mapMutations可以简化对mutations的调用，它可以将mutations映射为组件的方法。使用mapMutations有如下写法：

...mapMutations(['mutation1', 'mutation2'])

这样就可以将mutations中的mutation1和mutation2映射为当前组件的方法。

需要注意的是，有人提到mapXXX已经过时了，建议使用其他方式替代，具体可以参考相关链接：。