Некоторые значки UI-Fabric не работают в веб-частях spfx React
Я скачал стороннюю веб-часть с Github
Некоторые значки пользовательского интерфейса не работают в сторонней веб-части, которую я скачал с Github.
Я использую Microsoft CDN для загрузки CSS. Версия CSS, которую я пробовал:
1.
2.
Большинство иконок работают, когда я использую ms-Icon ms-Icon--'IconName'
, Но пользователи сообщили, что некоторые значки не работают, что я перечисляю здесь:
HandsFree
Warning12
Transition
TimeSheet
Commitments
Calculator
1. В настоящее время мы используем версию 9 CSS CDN из пользовательского интерфейса. Я попытался изменить версию CSS на 10, которая является самой последней, но все еще некоторые значки все еще не работают, а некоторые работают.
2. Github блоги говорят ms-Fabric
класс должен быть добавлен в корневой div HTML, чтобы все иконки работали. Я проверил, что этот класс уже добавлен в корневой div. Поэтому я попытался добавить этот класс к непосредственному родителю промежутка, но некоторые значки все еще не решены.
3. У меня было сомнение, что, возможно, есть какая-то проблема с конфигурацией этих значков из библиотеки MS Fabric. Поэтому, чтобы проверить это, я воспроизвел структуру на онлайн-сайте под названием "codepen" и обнаружил, что с этими значками проблем нет. Существует определенная проблема с тем, как он используется.
То, как я загружаю CSS в файл.js:
sp_loader_1.SPComponentLoader.loadCss('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/10.0.0/css/fabric.min.css');
Вот код, который я написал, чтобы привязать значок к элементам управления:
public renderAdvancedDefaultLayout(item: any): JSX.Element{
return(
<div className={styles["box-link"]} role="link" key={"item-
"+this.props.links.indexOf(item)}>
<a href={item[urlField]} target={item[openNewTabField] ? "_blank" :
""}>
<div className={styles["box-button"]+" "+(item[isBlueField] ?
styles["blue"] : "")}>
<i className={item[iconField] ? "ms-Icon ms-Icon--
"+item[iconField] : ""}></i>
{item[urlField+"_text"]}
</div>
</a>
</div>
);
}
Я хочу, чтобы все иконки работали с использованием этих CDN. В настоящее время большинство значков работают, но не много (по крайней мере, перечисленные). Любая помощь будет принята с благодарностью. Спросите меня, если я пропущу, чтобы добавить какую-либо информацию здесь.