Projekt-Anfragen: Tel: 07022/9319004 info@CodeDocu.de Software Entwicklung in C# WPF Asp.Net Core Vba Excel Word SQL-Server EF Linq, UWP Net
#

Download:

Datei 1: List.ts
Datei 2: WebPart01WebPart.ts

SPO: eine Liste verwenden

 

Hierzu erstellt man im Ordner src\webparts\webpart01   eine neue .ts Datei als Zugriff auf die Liste

Hier im Beispiel

List01.ts

 

 

Dann wird eine Schnittstelle zur SharePoint Liste erstellt

 

Zugriff zur SharePoint Liste

Typescript Code, React:

//< Imports >

import { ISPList } from './WebPart01WebPart';   //I Interface as: SharePoint List 

//</ Imports >

 

export default class List01Client  {

    //----------< List01Client() >------------

    //* creates a list

 

    //--< List-Items-Array >--

    private static _itemsISPList[] = [{ Title: 'Todo Item 1'Id: '1' },

                                        { Title: 'Todo Item 2'Id: '2' },

                                        { Title: 'Todo Item 3'Id: '3' }];

    //--</ List-Items-Array >--

 

    //--< get_Items() >--

    //*async get methode do get the list from outside

    public static get(): Promise<ISPList[]> {

        return new Promise<ISPList[]>((resolve=> {

            resolve(List01Client._items);

        });

    }

 

    //----------</ List01Client() >------------

}

 

 

In der Webpart-Datei .ts fügt man eine methode ein zum lesen der SharePoint liste

 

  //----< GetList() >----

  private _getListData(): Promise<ISPLists> {

    return List01Client.get()

      .then((dataISPList[]) => {

        var listDataISPLists = { value: data };

        return listData;

      }) as Promise<ISPLists>;

  }

  //----</ GetList() >----

 

 

Verweise zu Listen einbinden

Damit der Zugriff auf die SharePoint Listen und die Übergabe zur Liste funktioniert, muss im Dateikopf die Schnittstelle zu SharePoint Listen ISPList eingefügt werden, der SharePoint httpClient SPHttpClient und ein Bezug zur externen Datei Liste.ts, welche zuvor erstellt wurde

 

 

Code Typescript / React / SharePoint zum einbinden der Listen

import { List01Client } from './List';                        //*get Interface to List

 

import {

  SPHttpClient,

  SPHttpClientResponse

from '@microsoft/sp-http';

 

//----</ Import >----

 

//----< Export >----

//*Listen zugriff Sharepoint

//< Listen >

export interface ISPLists {

  valueISPList[];

}

 

export interface ISPList {

  Titlestring;

  Idstring;

}

//</ Listen >

 

export interface IWebPart01WebPartProps {

  descriptionstring,

  ctx:   WebPartContext;

}

 

export default class WebPart01WebPart extends BaseClientSideWebPart<IWebPart01WebPartProps> {

//----</ Export >----

 

 

 

Test der SharePoint Listen mit

gulp serve

Zum Testen, ob der Code soweit fehlerfrei ist, sollte man gulp serve ausführen

Mobile
»
SharePoint Icons
»
SharePoint Web-Elemente: Fabric React und Fabric Core
»
Code zu SharePoint Liste und Webpart Hello World Sample
»
gelöst: SharePoint Style wird nicht angezeigt
»
SharePoint Aussehen von WebPart ändern
»
SharePoint Listen in Webparts verwenden
»
Context des Webparts ermitteln
»
WebPart Manifest
»
Programmieren des WebParts in SharePoint
»
Webpart testen in der Workbench

.

Jobs, Projekte, Angebote für Freiberufler, Selbstständig an Info@CodeDocu.de