将 json 对象映射到不需要计算表达式的模型

Question

我有这个端点，它改变了有效负载格式，这会导致问题。 以前是这样的

{
    "result": [
      {
        "name": "lorem ipsum",
        "introHtml": "lorem ipsum",
        "url": "lorem ipsum",
        "thumbnail": "lorem ipsum small image",
        "publishDate": "lorem ipsum"
      }, 
    ]
}

现在

{
    "result": [
        {
            "name": "lorem ipsum",
            "introHtml": "lorem ipsum",
            "url": "lorem ipsum",
            "imageSet": [
                {
                    "url": "lorem ipsum small image",
                },
                {
                    "url": "lorem ipsum big image",
                }
            ],
            "publishDate": "lorem ipsum"
        },

问题是引入了

imageSet

，它之前只是一张缩略图中的图像。 所以我需要将其映射到仅使用一张图像的模型，因为 salesforce lwc 不允许我使用计算表达式，例如

imageSet[0].url

那么我需要绘制这个吗？或者有没有办法访问第一个元素？

Answer 1

您是从某个第三方系统获取它，对吧？使用 Apex 进行标注，将其返回给 JavaScript。该顶点被称为

@wire

或直接（强制）...我的观点是有空间注入一些后处理。我将使用来自 https://developer.salesforce.com/docs/platform/lwc/guide/apex-wire-method.html

的示例

如果当前您的变量是“简单线”获取的

@wire(findContacts, { searchKey: "$searchKey" }) contacts;

并且您的模板会循环

<template for:each={contacts.data} for:item="contact">

然后您可以轻松地将其转换为调用处理函数

@wire(getContactList)
  wiredContacts({ error, data }) {
    if (data) {
      this.contacts = data;
      this.error = undefined;
    } else if (error) {
      this.error = error;
      this.contacts = undefined;
    }
  }

您丢失了“wiredContacts”变量，它被分解为单独的数据和错误（如果您愿意，您仍然可以存储整个内容，例如，当您需要“refreshApex”调用时它很有用）。因此，您的循环和错误处理必须进行一些更改，但要点是 - 您可以在将数据存储在

this.contacts

;

之前对这些数据执行一些操作

有时我们必须对来自 Apex 的内容进行后处理，例如使用 Lightning-datatable 时：https://salesforce.stackexchange.com/q/287262/799。另一个例子：https://salesforce.stackexchange.com/q/290393/799

因此循环遍历结果，注入一个仅包含第一个 url 的新字段并在 html 中引用该字段。

公平地说，我们也可以在 Apex 中做到这一点，但工作量大却收效甚微。你现在在做什么，直接把JSON字符串传回JS吧？解析它的开销（祈祷没有保留关键字）、修改、序列化回来......有时担心你是否会达到 6MB 内存限制......嗯。