Vue 子组件如何接收父组件传递的 Map 变量？

偷偷努力，悄无声息地变强，然后惊艳所有人！哈哈，小伙伴们又来学习啦~今天我将给大家介绍《Vue 子组件如何接收父组件传递的 Map 变量？ 》，这篇文章主要会讲到等等知识点，不知道大家对其都有多少了解，下面我们就一起来看一吧！当然，非常希望大家能多多评论，给出合理的建议，我们一起学习，一起进步！

如何向 Vue 子组件传递 Map 变量

在 Vue 中，父组件可以通过 props 向子组件传递数据。但是，当要传递一个 Map 类型的变量时，可能会遇到报错。

问题表现：

• 赋值：

  data() {
    return {
      roomPictureList: new Map()
    }
  }

• 传递： 将 roomPictureList 通过 props 传递给子组件

• 控制台报错：

  TypeError: Supplied property "roomPictureList" was not valid. Vue received a value that was not compatible with the expected prop type: Map.

解决方案：

问题出在 roomPictureList 的初始值是一个空对象。为了解决这个问题，可以将其改成 null：

data() {
  return {
    roomPictureList: null
  }
}

这样，在传递给子组件时，Vue 便能够正确识别并接收 Map 变量。

理论要掌握，实操不能落！以上关于《Vue 子组件如何接收父组件传递的 Map 变量？ 》的详细介绍，大家都掌握了吧！如果想要继续提升自己的能力，那么就来关注golang学习网公众号吧！