Элемент управления Pivot UI Fabric-js — нет функции переполнения элемента ссылки

Я пытаюсь использовать Pivot из JS-библиотеки Office UI Fabric, но я обнаружил, что у него нет функций для обработки переполнения элементов ссылок.

Документация показывает переполнение как многоточие, однако за ним нет никакой функциональности. Это только для презентации.

Кто-нибудь модифицировал этот компонент, чтобы он автоматически менял размер и правильно отображал все ссылки?


javascript office-ui-fabric office-js
person Leo    schedule 27.04.2018    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Существует известная проблема с элементом управления Pivot. Чтобы заставить его работать, вам нужно переопределить overflow-x: hidden, установленный в таблице стилей по умолчанию. Добавление следующего в CSS вашей страницы, похоже, исправит это:

.ms-Pivot{
  overflow-x: visible;
}

Вам также необходимо подключить JavaScript для сводного и контекстного меню. Сюда входит скрипт для переключения классов is-hidden и is-open при нажатии на многоточие.

На данный момент нет автоматического изменения размера вкладки или автоматического перемещения переполненных элементов в контекстное меню.

person Marc LaFleur    schedule 27.04.2018
comment
Спасибо, @Marc LaFleur. То, что вы сказали, помогает. В настоящее время я использую height:auto; overflow-x: auto; white-space: normal;, чтобы переместить элемент управления на другую строку... Это выглядит не очень хорошо, но у меня нет времени, чтобы расширить элемент управления для работы с переполнением эллипсов. Я мог бы вернуться к этому в ближайшие несколько недель. Пока я оставлю этот вопрос открытым, на случай, если у кого-то есть фрагмент кода, которым можно поделиться :) - person Leo; 27.04.2018