我有用户可以选择的下拉选项列表。
下拉列表中的 optinos 是用标签制作的:<a href>:
<a onClick={() => handleSelect(filter)} role="button">
{filter.name}
</a>
问题是我必须添加tabIndex="0" or -1
,以修复来自 Eslint 的错误。
但是当我添加时tabIndex=0
,我的按钮不再起作用。
有没有其他方法可以修复此错误?
这是下拉组件的外观:
<ul name="filters" className="dropdown">
{filterOptions.map((filter) => (
<li
key={filter.id}
defaultChecked={filter.name}
name={filter.name}
className={`option option-${filter.selected ? 'selected' : 'unselected'}`}
>
<span className={`option-${filter.selected ? 'checked-box' : 'unchecked-box'} `} />
<a onClick={() => handleSelect(filter)} role="button">
{filter.name}
</a>
</li>
))}
</ul>