如何读取 Map<String,List<String>> 并获取 LWC JavaScript 中的键和值？

Question

数据来自Controller like Map<String,List<String>，需要读取Javascript中的Map。我尝试使用 keyset() 获取密钥，但失败了。

地图中的原始数据是：

{"error":["Error Fields: (FirstName) : FirstName required.","Error Fields: (Phone) : Office Phone Number Required.","Error Fields: () : House Phone number required"]}

在上面的数据中，我想根据Key'error'循环valueList。

编辑

使用以下解决方案解决了上述问题。但是现在我在 HTML 页面中逐行显示错误消息时遇到了问题。我曾经使用 \n 来划分错误消息，但在控制台中打印，它看起来不错。但是当我传递到 HTML 时，它再次彼此相邻显示。这是代码。

result['error'].forEach( x=>{                                   
                errMsg += x+ '\n';
             });      
             this.showErrorMessage = true;

控制台结果：

errorMessage*****

FirstName Required.
Office Phone Number Required.
House Phone number required

但是在HTML中显示时，它是这样并排显示的：FirstName Required。办公室 Phone 需要号码。需要房屋 Phone 号。

HTML代码：

<template if:true={showErrorMessage}>
                        <div>
                            <h6 style="color: red;">{errMsg }</h6>
                        </div>

                    </template>

Answer 1

JavaScript 没有 keyset 方法，您可能将它与 Apex 混淆了吗？

你可以那样做，有点老派，但如果你想要可读性

let x = {
    "error":[
        "Error Fields: (FirstName) : FirstName required.",
        "Error Fields: (Phone) : Office Phone Number Required.",
        "Error Fields: () : House Phone number required"
     ]
};

if(x && x.error && x.error.length){
    for(let i = 0; i < x.error.length; ++i){
        console.log(x.error[i]);
    }
}

或者，如果您熟悉现代 JavaScript 和回调函数，您可以使用 array.map 方法

x.error.map(function(row){
    console.log(row);
});

甚至"arrow function"

console.log(x.error.map(i => i));

如果您开始使用 Lightning Web Components，像 https://trailhead.salesforce.com/en/content/learn/modules/modern-javascript-development 这样的线索可能会有所帮助。或者任何关于 EC6 的在线课程（EcmaScript 6，JavaScript 规范的版本，你会在一些 LWC 教程中看到很多）。有一些黑魔法，如展开运算符、箭头函数，需要一段时间才能习惯。

从编写更冗长但可读的代码开始并慢慢转向更高级的语法并没有错，尤其是当你在大团队中并且不是每个人都是 JS 神时。

如何读取 Map<String,List<String>> 并获取 LWC JavaScript 中的键和值？

How to read Map<String,List<String>> and get key and values in LWC JavaScript?

salesforce

salesforce-lightning

编辑