javascript - 基于条件的对象键映射不起作用

Question

我试过下面的代码，但不工作：

Object.keys(singleproductdetails).map(function(detail, id) {                                                                
return (
  <div>
    <ul className="list-inline">
      <li>{detail} <span>:</span></li>
      {
        id == 12 ?
          <li>
            <p>
              <a
                href={'http://' + singleproductdetails[detail]} 
                target="_blank"
                style={{color: "#1e1e80"}}>
                {singleproductdetails[detail]}
              </a>
            </p>
          </li> :
          <li><p>{singleproductdetails[detail]}</p></li>
      }
    </ul>
  </div>
})

我正在尝试提供指向特定密钥的链接，但我无法做到

标签： javascriptreactjs

Answer 1

您的问题如下：您的映射Object和它们返回您要呈现的 UI，但map在这种情况下，该方法返回一个Arrayof Objects（这就是您要显示的），因此您需要按顺序读取该数组显示 de UI，例如：

const UI = Object.keys(singleproductdetails).map(function(detail, id) {                                                                
return (
  <div>
    <ul className="list-inline">
      <li>{detail} <span>:</span></li>
      {
        id == 12 ?
          <li>
            <p>
              <a
                href={'http://' + singleproductdetails[detail]} 
                target="_blank"
                style={{color: "#1e1e80"}}>
                {singleproductdetails[detail]}
              </a>
            </p>
          </li> :
          <li><p>{singleproductdetails[detail]}</p></li>
      }
    </ul>
  </div>
});

他们，在你的render方法中（一个例子）：

render() {
  return (
    <div>{UI}</div>
  )
}

这是一个 StackBlitz 显示我在说什么..