vue3 中高效读写 map 值

在 vue3 中，读取后端传回的包含 hashmap 的对象时可能会遇到问题。使用 get() 方法无法直接访问 map 值。

问题详情：

例如，以下代码试图读取名为 productbigdecimalmap1 的 hashmap：

立即学习“前端免费学习笔记（深入）”；

commoditypagelist.value[0].productbigdecimalmap1.get(35)

然而，这种方式会抛出错误。

蓝湖代码转vue2.0+element-ui

将静态 Vue 页面(index.vue)改造为动态页面(Custom.vue)；稿源仅限 index.vue、其引用的 CSS 与资源路径，禁止参考仓库内其他文件。Invoke when user wants to transform a static Vue page into a dynamic data-driven page with Element UI components.

下载

解决方案：

要在 vue3 中读写 map 值，需要使用中括号语法：

commoditypagelist.value[0].productbigdecimalmap1[key]

其中 key 是要访问的特定键。

示例：

// 获取键为 '35' 的值
commodityPageList.value[0].productBigDecimalMap1['35']

使用中括号语法，可以直接访问 map 值，无需使用 get() 方法。