0

我正在开发一个 SharePoint 在线现代团队网站，我正在按照这些步骤在我的页面中注入自定义 CSS @ https://tahoeninjas.blog/2018/05/08/inject-custom-css-on-sharepoint-modern -pages-using-spfx-extensions/ .. 现在效果很好，我在.ts文件中添加了这个：-

import { override } from '@microsoft/decorators';
import { Log } from '@microsoft/sp-core-library';
import {
  BaseApplicationCustomizer
} from '@microsoft/sp-application-base';
import { Dialog } from '@microsoft/sp-dialog';

import * as strings from 'StartApplicationCustomizerStrings';

const LOG_SOURCE: string = 'StartApplicationCustomizer';

/**
 * If your command set uses the ClientSideComponentProperties JSON input,
 * it will be deserialized into the BaseExtension.properties object.
 * You can define an interface to describe it.
 */
export interface IStartApplicationCustomizerProperties {
  // This is an example; replace with your own property
  cssurl: string;
}

/** A Custom Action which can be run during execution of a Client Side Application */
export default class StartApplicationCustomizer
  extends BaseApplicationCustomizer<IStartApplicationCustomizerProperties> {

    @override

    public onInit(): Promise<void> {
      Log.info(LOG_SOURCE, `Initialized ${strings.Title}`);
  
      const cssUrl: string = this.properties.cssurl;
      if (cssUrl) {
          // inject the style sheet
          const head: any = document.getElementsByTagName("head")[0] || document.documentElement;
          let customStyle: HTMLLinkElement = document.createElement("link");
          customStyle.href = cssUrl;
          customStyle.rel = "stylesheet";
          customStyle.type = "text/css";
          head.insertAdjacentElement("beforeEnd", customStyle);
      }
  
      return Promise.resolve();
    }
  }

以及以下内容elements.xml：-

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
    <CustomAction
        Title="Start"
        Location="ClientSideExtension.ApplicationCustomizer"
        ClientSideComponentId="a7074bac-2326-4ba6-8061-4931c05f47f0"
        ClientSideComponentProperties="{&quot;cssurl&quot;:&quot;/Style%20Library/custom.css&quot;}">
    </CustomAction>
</Elements>

现在它在所有页面上都运行良好>>但我不确定如何修改我的 SPFX 以执行以下操作：-

  1. 只在网站主页上运行扩展程序？

这可能吗？谢谢

4

1 回答 1

0

不确定您是否还在寻找答案。但是将此建议发布给其他人。检查this.context.pageContext.legacyPageContext["isWebWelcomePage"]. 如果为真，则表示它是该站点的主页。

仅当您将此标志设置为 true 时才渲染您必须做的任何事情，否则不要。

于 2021-12-07T05:11:24.583 回答