Acccessing SOQL query data values in Lighting Web Component

Question

I am trying to figure out how to display the values for a couple of fields in a Lightning Web Component that is driven by the following SOQL query: SELECT Id, ActivityDateTime, Account.Name, Who.Name, Subject FROM Event

The resulting query results in Workbench come back like this:

In my LWC I am able to display the first 3 fields, but the 'Account.Name' and 'Name.Name' values currently return a blank value when I try to reference them using those fieldnames in my javascript file.

These are my questions I could use some help understanding:

1. What is the correct format to use to display the Account Name and Contact Name values?
2. Why does the Subject column show before the last two in the results, even though it comes last in the SOQL query?
3. Why is the result showing Name.Name instead of Contact.Name?

Thanks very much!

Answer 1

What is the correct format to use to display the Account Name and Contact Name values?

You have to flatten the object, because the data table can't traverse object relationships. Something like:

this.events = data.map((datum) => ({...datum, contactName: datam.Who.Name, accountName: datum.Account.Name }));

You then refer to them as their flattened name:

{ fieldName: 'contactName', label: 'Contact Name', type: 'text' }

Why does the Subject column show before the last two in the results, even though it comes last in the SOQL query?

I'm pretty sure workbench is sorting the columns this way. They appear to be returned in order from the API.

Why is the result showing Name.Name instead of Contact.Name?

Because Who is of type Name, which is used whenever you have a polymorphic field (e.g. Who points to both Lead and Contact). See above screenshot.