如何使用 JavaScript 正确销毁地图函数中的对象？

Question

我想知道如何.map使用 javascript 来破坏函数内的对象，我有 React js 组件，并且在return方法中我有以下代码：

return (
    <>
      {setItems.map(setItem => (
      
      const { childContentfulPartFeatureSetLearnMoreOptionalTextTextNode: learnNode} = setItem
    ....
    </>

我有下一个错误：Parsing error: Unexpected token ... = setItem，我想这是什么

EsLint错误并用于// eslint-disable-next-line禁用它，但它不起作用。

UPD 完整返回码：

return (
<div className={generalServiceItemClassName} key={guuid()}>
  {setItems.map(setItem => (
   const { childContentfulPartFeatureSetLearnMoreOptionalTextTextNode: learnNode} = setItem

    <div
      key={guuid()}
      className={cx(columnSizeClass, "service-items__item")}
      data-test="service-items"
    >
      {setItem.learnMore ? (
        <LearnMore
          className="service-items__item-learn-more-container"
          learnMoreLink={setItem.learnMore}
          text={}
          textClassName="service-items__item-texts-learn-more"
          learnMoreText={learnNode ? learnNode.setItem : null}
        >
          {renderItem(setItem)}
        </LearnMore>
      ) : (
        renderItem(setItem)
      )}
    </div>
  ))}
</div>

）

Answer 1

const表达式中不能有声明，并且当您使用箭头函数的简洁形式（后面=>没有{）时，主体是一个表达式。

不过，您可以在参数列表中解构。例如：

{setItems.map(({childContentfulPartFeatureSetLearnMoreOptionalTextTextNode: learnNode}) => (
    // ...use `learnNode` here...

在上下文中：

return (
    <div className={generalServiceItemClassName} key={guuid()}>
        {setItems.map(({childContentfulPartFeatureSetLearnMoreOptionalTextTextNode: learnNode}) => (
            <div
              key={guuid()}
              className={cx(columnSizeClass, "service-items__item")}
              data-test="service-items"
            >
                {setItem.learnMore ? (
                    <LearnMore
                        className="service-items__item-learn-more-container"
                        learnMoreLink={setItem.learnMore}
                        text={}
                        textClassName="service-items__item-texts-learn-more"
                        learnMoreText={learnNode ? learnNode.setItem : null}
                    >
                        {renderItem(setItem)}
                    </LearnMore>
                    ) : (
                        renderItem(setItem)
                    )
                }
            </div>
        ))}
    </div>
);