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 变量?的详细内容,更多请关注其它相关文章!