Question

我已经从Github下载了第三方Webpart

某些UI架构图标在我从Github from here下载的第三方Webpart中无法使用。

我正在使用Microsoft CDN加载CSS。我尝试过的CSS版本是：

1.

2.

当我使用ms-Icon ms-Icon--'IconName'时，大多数图标都可以使用。但是用户报告了一个问题，说某些图标不起作用，我在这里列出了这些信息：

HandsFree

警告12

过渡

TimeSheet

承诺

计算器

当前，我们正在使用9版的UI构造CSS CDN。我尝试将css版本更改为最新版本的10，但是仍然有些图标仍然无法使用，而有些却可以使用。
Github博客说ms-Fabric类必须在html的根div中添加，以使所有图标正常工作。我确认该类已添加到根div中。因此，我尝试将此类添加到范围的直接父类，但某些图标仍未解析。
我怀疑MS Fabric库中的这些图标配置可能存在一些问题。因此，为了进行测试，我在一个名为“ codepen”的在线网站上复制了该结构，发现这些图标没有问题。使用方式肯定存在一些问题。

我在.js文件中加载CSS的方式是：

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来工作。目前，大多数图标都可以使用，但数量不多（至少列出了这些图标）。

一些UI-Fabric图标在spfx React Webparts中不起作用

0 个答案: