Reactjs SPFx如何在列表中设置人员字段,例如“转换”AccountName为查找ID?

Reactjs SPFx如何在列表中设置人员字段,例如“转换”AccountName为查找ID?,reactjs,sharepoint,web-parts,peoplepicker,spfx,Reactjs,Sharepoint,Web Parts,Peoplepicker,Spfx,我正在尝试使用React Office UI Fabric构建SPFX Web部件。我有一个SharePoint列表,其中有一个名为AssignedTo的人员字段。ID值类似于12、20等等。当我使用PeoplePicker选择一个人时,我会得到类似I:0.f | membership的AccountName|bob@somewhere.org.nz和类似ff53b41e-d11a-435c-9cd1-d708e71ee7c7的GUID 如何将PeoplePicker中的信息转换为列表中的Peo

我正在尝试使用React Office UI Fabric构建SPFX Web部件。我有一个SharePoint列表,其中有一个名为AssignedTo的人员字段。ID值类似于12、20等等。当我使用PeoplePicker选择一个人时,我会得到类似I:0.f | membership的AccountName|bob@somewhere.org.nz和类似ff53b41e-d11a-435c-9cd1-d708e71ee7c7的GUID

如何将PeoplePicker中的信息转换为列表中的People字段正在使用的ID

PeoplePicker按如下方式检索人员:

private searchPeople(terms: string, results: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
  return new Promise<IPersonaProps[]>((resolve, reject) =>
  this.props.spHttpClient.get(`${this.props.siteUrl}/_api/search/query?querytext='*${terms}*'&rowlimit=20&sourceid='b09a7990-05ea-4af9-81ef-edfab16c4e31'`,
    SPHttpClient.configurations.v1,
    {
      headers: {
        'Accept': 'application/json;odata=nometadata',
        'odata-version': ''
      }
    })
    .then((response: SPHttpClientResponse): Promise<{ PrimaryQueryResult: IPeopleDataResult }> => {
      return response.json();
    })
    .then((response: { PrimaryQueryResult: IPeopleDataResult }): void => {
      let relevantResults: any = response.PrimaryQueryResult.RelevantResults;
      let resultCount: number = relevantResults.TotalRows;
      let people = [];
      if (resultCount > 0) {
        relevantResults.Table.Rows.forEach( (row) => {
          let persona: IPersonaProps = {};
          row.Cells.forEach( (cell) => {

            if (cell.Key === 'PictureURL')
            {
              persona.imageUrl = cell.Value;
            }
            else if (cell.Key === 'PreferredName')
            {                  
              persona.primaryText = cell.Value;
              persona.imageInitials = cell.Value.charAt(0) + (cell.Value.lastIndexOf(" ") > 0 ? cell.Value.charAt(cell.Value.lastIndexOf(" ") + 1) : "");
            }
            else if (cell.Key === 'AccountName')
            {                  
              persona.itemID = cell.Value; // e.g.: "i:0#.f|membership|bob@somewhere.org.nz"
            }
            else if (cell.Key === 'UserProfile_GUID')
            {                  
              persona.itemID = cell.Value; // e.g.: "ff53b41e-d11a-435c-9cd1-d708e71ee7c7"
            }
          });
          people.push(persona);
        });
      }
      resolve(people);
    }, (error: any): void => {
      reject(this._peopleList = []);
    }));
}
private _getItems(requester: SPHttpClient): Promise<IInteractionLogItem[]> {
  const queryString: string = `?$select=Id,Title,Client/Id,Client/Title,Client/EMail,Client/MobilePhone,` +
  `$expand=Client`;
const queryUrl: string = this._listItemsUrl + queryString;

return requester.get(queryUrl, SPHttpClient.configurations.v1)
  .then((response: SPHttpClientResponse) => {
    return response.json();
  })
  .then((json: { value: IInteractionLogItem[] }) => {
    return json.value.map((interactionLog: IInteractionLogItem) => {
      const returnItem: IInteractionLogItem = 
      { 
        Id: interactionLog.Id, 
        Title: interactionLog.Title, 
        Client: interactionLog.Client,
      };

      returnItem.CreatedBy.Picture = this._getPictureUrl(returnItem.CreatedBy.EMail);

      if( returnItem.Client )
      {
        returnItem.Client.Picture = this._getPictureUrl(returnItem.Client.EMail);
      }

      return returnItem;
    });
  });
}
我得到的列表项目如下:

private searchPeople(terms: string, results: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
  return new Promise<IPersonaProps[]>((resolve, reject) =>
  this.props.spHttpClient.get(`${this.props.siteUrl}/_api/search/query?querytext='*${terms}*'&rowlimit=20&sourceid='b09a7990-05ea-4af9-81ef-edfab16c4e31'`,
    SPHttpClient.configurations.v1,
    {
      headers: {
        'Accept': 'application/json;odata=nometadata',
        'odata-version': ''
      }
    })
    .then((response: SPHttpClientResponse): Promise<{ PrimaryQueryResult: IPeopleDataResult }> => {
      return response.json();
    })
    .then((response: { PrimaryQueryResult: IPeopleDataResult }): void => {
      let relevantResults: any = response.PrimaryQueryResult.RelevantResults;
      let resultCount: number = relevantResults.TotalRows;
      let people = [];
      if (resultCount > 0) {
        relevantResults.Table.Rows.forEach( (row) => {
          let persona: IPersonaProps = {};
          row.Cells.forEach( (cell) => {

            if (cell.Key === 'PictureURL')
            {
              persona.imageUrl = cell.Value;
            }
            else if (cell.Key === 'PreferredName')
            {                  
              persona.primaryText = cell.Value;
              persona.imageInitials = cell.Value.charAt(0) + (cell.Value.lastIndexOf(" ") > 0 ? cell.Value.charAt(cell.Value.lastIndexOf(" ") + 1) : "");
            }
            else if (cell.Key === 'AccountName')
            {                  
              persona.itemID = cell.Value; // e.g.: "i:0#.f|membership|bob@somewhere.org.nz"
            }
            else if (cell.Key === 'UserProfile_GUID')
            {                  
              persona.itemID = cell.Value; // e.g.: "ff53b41e-d11a-435c-9cd1-d708e71ee7c7"
            }
          });
          people.push(persona);
        });
      }
      resolve(people);
    }, (error: any): void => {
      reject(this._peopleList = []);
    }));
}
private _getItems(requester: SPHttpClient): Promise<IInteractionLogItem[]> {
  const queryString: string = `?$select=Id,Title,Client/Id,Client/Title,Client/EMail,Client/MobilePhone,` +
  `$expand=Client`;
const queryUrl: string = this._listItemsUrl + queryString;

return requester.get(queryUrl, SPHttpClient.configurations.v1)
  .then((response: SPHttpClientResponse) => {
    return response.json();
  })
  .then((json: { value: IInteractionLogItem[] }) => {
    return json.value.map((interactionLog: IInteractionLogItem) => {
      const returnItem: IInteractionLogItem = 
      { 
        Id: interactionLog.Id, 
        Title: interactionLog.Title, 
        Client: interactionLog.Client,
      };

      returnItem.CreatedBy.Picture = this._getPictureUrl(returnItem.CreatedBy.EMail);

      if( returnItem.Client )
      {
        returnItem.Client.Picture = this._getPictureUrl(returnItem.Client.EMail);
      }

      return returnItem;
    });
  });
}
非常感谢您的帮助:-

需要使用SPHttpClient调用api/web/ensureuser。它确保将请求的用户加载到SharePoint网站userinfo中。使用给定的AccountName,如i:0.f | membership|bob@somewhere.org.nz从搜索作为参数。返回的SPUser包含查找列的Id字段。我实现了以下方法:

public EnsureUser(userName: string): Promise<ISPUser> {
  console.log("SharePointDataProvider.EnsureUser( \"" + userName + "\" )");
  var data = {logonName: userName};

  return this._webPartContext.spHttpClient.post(
    this._ensureUserUrl, 
    SPHttpClient.configurations.v1,
    { body: JSON.stringify(data) } ).then(
      (value: SPHttpClientResponse) => {
        console.log("SharePointDataProvider.EnsureUser FullFill: statusText:\"" + value.statusText + "\"" );
        return value.json();
      },
      (error: any) => console.log("SharePointDataProvider.EnsureUser Rejected: " + error )
    ).then((json: ISPUser) => {
        console.log("SharePointDataProvider.EnsureUser FullFill: Id:" + json.Id +" LoginName:\"" + json.LoginName + "\"" );
      return json;
  });
}

如果你看到像这样的东西

id:i:0#.f|membership|bob@somewhere.org.nz
但是我想要身份证号码

id:18


到您的peoplePicker组件

太棒了!很高兴我能帮忙