Hello,
In this article, I will show you how to get the current context of the site and pass it to services. In the traditional method, we were getting the Current Context of the site from SP.ClientContext or using Rest API.
I have created a React-based SPFx Web part. I have different components, services and model folder. I want to pass the current context to my service, what I observe you can current context only in root or ‘*’WebPart .ts file. So get the value from the root component and pass to my services.
It helps to maintain all your services in one place, it makes code easy to maintain, understandable and DRY.
- So first get the Current context from the root file
- ReactHelloWorld is my child components, where I create Props and create a new object of spservices class
If you console it will return the whole object of the current context SPHttpClient, PageContext
- We are importing the WebPartContext class from the ‘@microsoft/sp-webpart-base package’ module and pass to context props, Add in ReactHelloWorld
- First, import the SPHttpClient class from the ‘@microsoft/sp-http package’ module and the WebPartContext class from the ‘@microsoft/sp-webpart-base package’ module in the spservices file
see the console results in below screenshot
- Declared the getContentTypeItems function in spservices, I added the IContentTypeMasterListItem as a model while getting the response
- Call the below function in componentWillMount() react lifecycle methods and perform the your actions.
Hope you find it helpful. If you liked this article, then please share and comment.
