Get user name using List view component?

Hi,

I am trying to get the user name (display name) from a people column in a spfx web part using the List view component but I am getting undefined.

The column calls SalesManager (internal name) and I am fetching its data like this:

const items = await sp.web.lists.getById('823e0102-5928-4f8a-bcda-f1794bd9026b').items
           .select(select)
           .get();
items.forEach(item => {
          Agreements.push({
                   SalesManager: item.SalesManager,
         });
});

And then unsing the received data like this:

private viewFields: IViewField[] = [
{
        name: "SalesManager",
        displayName: "Sales Manager",
        isResizable: true,
}];

In the render method:

<ListView
        items = {this.state.agreements}
/>

There are more items that shows in the list view but SalesManager is the one that is causing problems.

When I take a look to the console the SalesManager is undefined.

How can I get the display name? Do I need to do something special in the fetching part ?

Best regards

Americo

developer

PnP

Beau Cameron
Mar 26, 2019
Americo Perez Can you share what your select value is? Person field is complex field type, that you need to select the properties and expand on the field.

.select('SalesManager/FirstName, SalesManager/LastName').expand('SalesManager')

Beau Cameron

MVP

Mar 26, 2019

Americo Perez Can you share what your select value is? Person field is complex field type, that you need to select the properties and expand on the field.

 .select('SalesManager/FirstName, SalesManager/LastName').expand('SalesManager')

Americo Perez

Iron Contributor

Mar 27, 2019

Tahanks Beau Cameron , right now I am selecting everything:

public async getAgreements(): Promise<Agreement[]> {
          let select = '*';
          let Agreements: Agreement[] = [];
          const items = await sp.web.lists.getById('823e0102-5928-4f8a-bcda-f1794bd9026b').items.select(select).get();
         items.forEach(item => {
                 Agreements.push({
                        Title: item.Title,
                        AgreementName: item.Title,
                       CustomerAgreementNr: item.CustomerAgreementNr,
                       AgreementType: item.AgreementType,
                       SalesManager: item.SalesManagerId,
                       ContactPerson: item.ContactPerson,
                      DeliveryType: item.DeliveryType,
                     AgreementStartDate: item.AgreementStartDate,
                     AgreementEndDate: item.AgreementEndDate,
                      AgreementEnded: item.AgreementEnded,
                      LastPriceAdjustment: item.LastPriceAdjustment,
                     NextPriceAdjustment: item.NextPriceAdjustment,
                 });
         });
        return new Promise<Agreement[]>(async(resolve) => {
        resolve(Agreements);
});
 }

Regards!

Beau Cameron
MVP
Mar 27, 2019
Americo Perez I can see that, but that is not how the REST call works. It's a complex field type that you need to expand on to get it's values.

Forum Discussion

Get user name using List view component?

Resources