SPFx - How to fetch list items from another site collection?

Question

How to dynamically fetch list items from different site collection.

ex:I am deploying solution in /sites/sales and i want to pull list items from sites/makerting.

I want to use "Site Url" text box in property pane and based on the URL provided here , I want to fetch all the lists from that site under another property pane dropdown "SharePoint Lists".

Thanks in advance :)

Vaibhav Chauhan · Answer

Here is the Cascading dropdown tutorial with property pane but in your case you can use you site url text box and change the dronpdown based events to textbox based events. https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/guidance/use-cascading-dropdowns-in-web-part-properties The selected site url and listname from dropdown can be pass into your SPFx react component as props value and used to fetch the related data using REST API/ Pnp.

Satya Karki · Answer

Hi, check this https://www.c-sharpcorner.com/article/use-pnp-js-to-fetch-list-items-from-other-site-collection-in-sharepoint-online/

Rijwan Ansari · Answer

HI You can do private web = Web( "https://testinglala.sharepoint.com/sites/marketing/" ); define web with destination site collection then public componentDidMount = () => { this .web.lists.getByTitle( "Employee" ).items().then((items) => { this .setState({ listItems: items }); }). catch ((err) => { console.log(err); }); }

Primal Lobo · Answer

I want to fetch dynamically from property pane configuration. Can you help on this approach

SPFx - How to fetch list items from another site collection?

Answers (4)