#

Wie kann man in einem SharePoint WebPart den Titel oder die URL ermitteln

 

Das SharePoint WebPart ermittelt über den HTML/URL Context die Eigenschaften einer Webseite.

Damit man den Context ermitteln kann, muss man ihn im Webpart in der render() Methode lesen.

SPFX, Webpart, SharePoint Online, React

 

Context des Webparts ermitteln

In der Render() Methode muss der Context zugewiesen werden

  public render(): void {

    const elementReact.ReactElement<any > = React.createElement(

      WebPart01,

      {

        description: this.properties.description,

        ctx: this.context        

      }

    );

 

 

Context an HTML übergeben

Damit es zur HTML Ausgabe-Datei WebPart.tsx übergeben werden kann, muss es in die externe Schnittstelle eingefügt werden

export interface IWebPart01WebPartProps {

  descriptionstring,

  ctx:   WebPartContext;

}

 

 

In Webpart-Einstiegsdatei ts:

der WebPartWebPart.ts Datei

export interface IWebPart01WebPartProps {

  descriptionstring,

  ctx:   WebPartContext;

}

 

export default class WebPart01WebPart extends BaseClientSideWebPart<IWebPart01WebPartProps> {

 

//IWebPart01Props->any

 

  public render(): void {

    const elementReact.ReactElement<any > = React.createElement(

      WebPart01,

      {

        description: this.properties.description,

        ctx: this.context        

      }

    );

 

    ReactDom.render(elementthis.domElement);

  }

 

 

 

WebPartWebPart.ts

 

Anzeigen in HTML Ausgabe

In der HTML Render Datei .tsx

 

this.props.ctx.pageContext.web.absoluteUrl

und

this.props.ctx.pageContext.web.title

 

 

<p>URL={this.props.ctx.pageContext.web.absoluteUrl}</p>    

<p>Title={this.props.ctx.pageContext.web.title}</p>    

 

 

 

 

import * as React from 'react';

import styles from './WebPart01.module.scss';

import { IWebPart01Props } from './IWebPart01Props';

import { escape } from '@microsoft/sp-lodash-subset';

 

export default class WebPart01 extends React.Component<IWebPart01Props, {}> {

  public render(): React.ReactElement<IWebPart01Props> {

    return (

      <div className={ styles.webPart01 }>

        <div className={ styles.container }>

          <div className={ styles.row }>

            <div className={ styles.column }>

              <span className={ styles.title }>SharePoint WebPart React</span>

              <p className={ styles.subTitle }>Test01: Get Page Context</p>

              <p className={ styles.description }>Description: {escape(this.props.description)}</p>

              

              <p>URL={this.props.ctx.pageContext.web.absoluteUrl}</p>    

              <p>Title={this.props.ctx.pageContext.web.title}</p>    

 

              

            </div>

          </div>

        </div>

      </div>

    );

  }

}

 

 

 

Webpart Properties

IWebPartProps.ts

Hierzu muss in den Properties der Context als ctx zur Verfügung stehen

 

export interface IWebPart01Props {

  descriptionstring,  

  ctx

}

 

 

Mobile

.

0123movie.net