Onclick函数不适用于reactjs组件中的glyphycons

我有一个表的反应组件，表头是可排序的。我注意到文本中的th对于onclick方法很好，但是glyphicons对于onclick方法不起作用，尽管两者在同一个锚中。代码如下：

columns.push(
  <th key={index} data-nw-id={column.id} className={className.join(' ')}>
    {column.canSort
        ?
            <a href="#" className="u-textLink" onClick={e => {
                e.preventDefault();
                if (e.target.className == 'u-textLink' && allowSort) {
                    this.sortByColumn(e, column);
                };
            }}>
                {content} {this.props.sort == column.id
                    ? <span className={'icon-chevron-' + (this.props.order == 'asc' ? 'up' : 'down')}></span>
                    : null
                }
            </a>
        : content
    }

  </th>
);

columns.push(
{column.canSort
?
：内容
}
);

您也可以在以下标记中使用onClick方法。例如：

{content} {this.props.sort == column.id
            ? <span onClick={e => this.sortByColumn(e, column)} className={'icon-chevron-' + (this.props.order == 'asc' ? 'up' : 'down')}></span>
            : null                                
          }

{content}{this.props.sort==column.id
？this.sortByColumn（e，column）}className={'icon-chevron-'+（this.props.order='asc'？'up'：'down'）}>
：null
}

您也可以在以下标记中使用onClick方法。例如：

{content} {this.props.sort == column.id
            ? <span onClick={e => this.sortByColumn(e, column)} className={'icon-chevron-' + (this.props.order == 'asc' ? 'up' : 'down')}></span>
            : null                                
          }

{content}{this.props.sort==column.id
？this.sortByColumn（e，column）}className={'icon-chevron-'+（this.props.order='asc'？'up'：'down'）}>
：null
}

我建议将它们都放在容器div中，并将onClick放在容器上。我建议将它们都放在容器div中，并将onClick放在容器上