首页 > 解决方案 > .map 元素中的 Href 或链接,其中包含道具和子元素

问题描述

我有数据将使用 .map 函数填充并显示在表结构中

我想要什么?

我想让每个元素都成为可点击的链接。这样对应的产品就会在新标签页中打开

这是一段代码

<div className="product-section">
  <div className="card-body">
    <div className="table-scroll">
      <table
        className={
          sortSelectedCategorySetAttributes.length > 1
            ? "table table-striped table-borderless"
            : "column-noscroll"
        }
        style={{ marginTop: "0px" }}
      >
        <thead>
          <tr>
            <th className="sticky-fix">PRODUCT</th>
            {sortSelectedCategorySetAttributes &&
              sortSelectedCategorySetAttributes.map((attributes, index) => {
                return (
                  <th style={fixedHeader} key={index}>
                    {" "}
                    {attributes && attributes.name.toUpperCase()}
                  </th>
                );
              })}
          </tr>
        </thead>
        {console.log(rowData)}
        <tbody>
          {rowData.map(ele => {
            return <a href={ele.key}>{ele}</a>;
          })}
        </tbody>
      </table>
    </div>
  </div>
</div>;

Console.log 附在此处

标签: javascriptreactjs

解决方案


推荐阅读