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 に答える