This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm whether you accept or reject these cookies being set.

A cookie will be stored in your browser regardless of choice to prevent you being asked this question again. You will be able to change your cookie settings at any time using the link in the footer.

Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
Daten aus einem gerenderten JSX.Element übertragen
#1
Hallo zusammen, 
ich mach jetzt hier mal den Anfang, ich hoffe ich bin im richtigen Unterforum... 
Und zwar bin ich gerade dabei ein SPFx WebPart zur darstellung einer SharepointOnline-Kontaktliste zu erstellen. (mit CRUD-Operations)
Mein Problem liegt aktuell darin, dass ich in meiner _onRenderItemColumn-Methode einen Button in mein WebPart für jeden Kontakt einfüge und hierrüber die CRUD-Operation zum löschen dieses Kontakts aufrufen möchte. 
-> Wie bekomme ich die item.ID in meine deleteData-Methode aus dem onClick-Event?

  public _onRenderItemColumn(item: any, index: number, column: IColumn): JSX.Element {
   

    const fieldContent = item[column.fieldName as keyof IContact] as string;

    

    switch (column.key) {
      
      case 'Delete':
        return <Link onClick={() => this.deleteData(item)}>X</Link>;
        

      default:
        return <span>{fieldContent}</span>;
    }    
  }


  public async deleteData(item: any)
  {
    
    await sp.web.lists.getByTitle("ContactList").items.getById(item.ID).delete();

    alert("Contact deleted Successfully");

  }


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

    return (
      <div className={ styles.contactListFinalPnP }>
        <div className={ styles.container }>
          <div className={ styles.row }>
            <div className={ styles.column }>
              <span className={ styles.title }>Welcome to SharePoint!</span>
              <p className={ styles.subTitle }>Customize SharePoint experiences using Web Parts.</p>
              <p className={ styles.description }>{escape(this.props.description)}</p>
              <DetailsList
              items={this.state.contacts}
              setKey="set"
              columns={this.state.columns}
              onRenderItemColumn={this._onRenderItemColumn}
              onColumnHeaderClick={this._onColumnClick}
              onItemInvoked={this._onItemInvoked}
              onColumnHeaderContextMenu={this._onColumnHeaderContextMenu}
              //onActiveItemChanged="set"
              ariaLabelForSelectionColumn="Toggle selection"
              ariaLabelForSelectAllCheckbox="Toggle selection for all items"
              checkButtonAriaLabel="Row checkbox"
              />

Ich hoffe das ist soweit verständlich... Ich bin noch, naja, relativer Neuling und programmiere insgesamt erst seit September 2020.  Angel

Vielen Dank schonmal an alle für die Hilfe!

EDIT: Bin selbst auf die Lösung gekommen, manchmal denkt man einfach zu kompliziert ... ich werd es hier auch abändern für alle die eventuell mal das selbe Problem haben!
Zitieren
#2
Gut das du es geschafft hast.
Ich hätte auch erst mal kucken müssen und testen.
Als Lösung markieren Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 2 Gast/Gäste