javascript - 使用地图渲染多个 jsx 并包含引发语法错误：ReactJS

Question

我正在尝试使用呈现 jsx map，然后使用includes基于列表中存在的值显示文本。它抛出错误说"message": "Unexpected token. Did you mean {'}'} or}`。有人可以帮我弄这个吗

我尝试过的代码：

  return (
    <>
      {list.length
        ?
          list.map((item, idx) => {
            return (
              <span key={idx}>
                {item}
              </span>
            )}
          {list.includes("Test") && (
            <span key="test">
              Replacement
            </span> )
          }
        )
        : "-"}
    </>
  );

标签： javascriptreactjs

Answer 1

关闭大括号后，您正在函数list.includes内部调用。map我想你想要这样的东西：

  return (
    <>
      {list.length
        ?
          (<>
           {list.map((item, idx) => {
            return (
              <span key={idx}>
                {item}
              </span>
            )}
          )}
          {list.includes("Test") && (
            <span key="test">
              Replacement
            </span> )
          }
        </>)
        : "-"}
    </>
  );