Как сделать div вместо кнопки для сводной ссылки

Я хочу настроить PivotItem так, чтобы его можно было закрыть (что-то вроде вкладок браузера).

Я предоставил пользовательскую реализацию onRenderItemLink, отображающую значок X в правой части вкладки, и метод onClick на этом значке, который закроет вкладку.

Основная проблема, с которой я столкнулся, заключается в том, что этот PivotItem обернут button (Pivot.Base.tsx отображает Commandbutton), который перехватывает все события onClick на Firefox.

Firefox не допускает события onClick под кнопкой (похоже, это соответствует стандарту, поэтому это не считается ошибкой), поэтому я никогда не могу закрыть вкладку в Firefox.

Есть ли способ заставить пользовательский интерфейс Fabric создавать div, а не кнопку в этом сценарии?

Есть ли другой способ заставить div там (какой-то способ перехватить то, что создает пользовательский интерфейс ткани, и переключить кнопку с помощью div)?

Совет ценится.


office-ui-fabric
person rony l    schedule 27.06.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Закончилось закрытием вкладки, если кнопка была нажата с правой стороны

const clickX = clickEvent.pageX;
const buttonRight = clickEvent.currentTarget.offsetLeft + clickEvent.currentTarget.offsetWidth ;
if (buttonRight - clickX <= 40) {
  removeTab(tab);
}
person rony l    schedule 10.07.2018
comment
Можете ли вы предоставить больше информации? Это обратный вызов onLinkClick? Я пробовал, но смещения кажутся неправильными - person partyelite; 14.01.2019
comment
@partyelite это onLinkClick для элемента ‹Pivot› - person rony l; 01.02.2019