question

MahimaK-6741 avatar image
1 Vote"
MahimaK-6741 asked TongZhangMSFT-7548 commented

To display Sharepoint List Item in SpFx Webpart Service folder using Ui Controller and React Framework

I want to retrieve Sharepoint list item and display on Spfx Webpart using React Framework & Rest API Call.

My Requirements-
1. I want to use Service folder in vs code and ts file inside that.
2. RestApi function (to get item from the list) should be present in service file.
3. use of componentDidMount Method
4. Use of DetailsList Ui Controller to display List data.


office-sharepoint-onlineoffice-sharepoint-server-administrationoffice-sharepoint-server-development
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

sadomovalex avatar image
1 Vote"
sadomovalex answered

you need to construct and send HTTP request to SP REST API which retrieves list item Retrieve specific list item:

 GET https://{site_url}/_api/web/lists/GetByTitle('Test')/items({item_id})
 Authorization: "Bearer " + accessToken
 Accept: "application/json;odata=verbose"

Here is example of how to do that in SPFx: Display SharePoint list items using SPFx.


5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

TongZhangMSFT-7548 avatar image
1 Vote"
TongZhangMSFT-7548 answered TongZhangMSFT-7548 commented

Hi @MahimaK-6741,

Based on my research and testing, you can follow this document to create a SPFx Web Part to retrieve SharePoint list items using REACT and REST API.

Hope it can help you, thanks for your understanding and support.

Note: Microsoft is providing this information as a convenience to you. The sites are not controlled by Microsoft. Microsoft cannot make any representations regarding the quality, safety, or suitability of any software or information found there. Please make sure that you completely understand the risk before retrieving any suggestions from the above link.


If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.




· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Hi @MahimaK-6741,

I am checking to see if the problem has been resolved. If you have any questions or progress, you can contact me in time.

0 Votes 0 ·