PnP REST API call to get Image URL (FileRef) Property

Question

Started working on SPFx and would like to develop an Image Rotator. As a first step, I wanted to get all the images and respective properties using PnP JS and used the following call and got the response:

return sp.web.lists.getByTitle('RotatorImages').select("Title", "Id", "TargetURL", "FileRef").items.get();

As you can see above, I'm not able to locate the FileRef property and when I use conventional SharePoint REST API call, I'm able to get the property as shown below in the JSON Response.

https://company.sharepoint.com/sites/dev/suhas/modernexperience/_api/web/lists/getbytitle('RotatorImages')/items?$select=FileRef,Title,Id,TargetURL

JSON Response****************** <m:properties>

<d:Id m:type="Edm.Int32">Item ID: 2</d:Id>

<d:Title>Title: New Public Website Announcement</d:Title>

<d:TargetURL>Target URL: https://www.example.com/</d:TargetURL>

<d:FileRef>FileRef: /sites/dev/suhas/modernexperience/RotatorImages/New Public Web Site Announcement.png</d:FileRef>

</m:properties>

---

Can someone please provide direction on how to get FileRef property using PnP JS from a Picture Library in SharePoint Online.

Answer 1

Please put .select(...) part after .items. This odata element is used to filter item properties.

sp.web.lists.getByTitle('listname').items.select("Title", "FileRef").get();

Reference doc: https://pnp.github.io/pnpjs/sp/items/

BR