reactjs – 呈现逗号分隔的链接列表

发布时间：2020-12-15 20:51:53 所属栏目：百科来源：网络整理

导读：我想输出一个逗号分隔链接的列表,这是我的解决方案. var Item = React.createComponent({ render: function() { var tags = [],tag; for (var i = 0,l = item.tags.length; i l; i++) { if (i === item.tags.length - 1) { tag = spanTag key={i} tag={item.

我想输出一个逗号分隔链接的列表,这是我的解决方案.

var Item = React.createComponent({
  render: function() {

    var tags = [],tag;

    for (var i = 0,l = item.tags.length; i < l; i++) {
      if (i === item.tags.length - 1) {
        tag = <span><Tag key={i} tag={item.tags[i]} /></span>;
      } else {
        tag = <span><Tag key={i} tag={item.tags[i]} /><span>,</span></span>;
      }
      tags.push(tag);
    }

    return (
      <tr>
        <td>
          {item.name}
        </td>
        <td>
          {tags}
        </td>
      </tr>
    );

  }
});

我只是想知道是否有更好的,更干净的方式来完成这个？

谢谢

在汗学院,我们使用一个叫做intersperse的帮手：

/* intersperse: Return an array with the separator interspersed between
 * each element of the input array.
 *
 * > _([1,2,3]).intersperse(0)
 * [1,3]
 */
function intersperse(arr,sep) {
    if (arr.length === 0) {
        return [];
    }

    return arr.slice(1).reduce(function(xs,x,i) {
        return xs.concat([sep,x]);
    },[arr[0]]);
}

它允许您编写如下代码：

var tags = item.tags.map(function(tag,i) {
    return <Tag key={i} tag={item.tags[i]} />;
};
tags = intersperse(tags,",");

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!