How to retrieve context in SPFx 1.1.0?

Question

Good morning,

I need to create a spfx element to sharepoint 2016. the project dependencies are:

"react": "15.4.2",
"react-dom": "15.4.2",
"@types/react": "0.14.46",
"@types/react-dom": "0.14.18",
"@types/react-addons-shallow-compare": "0.14.17",
"@types/react-addons-update": "0.14.14",
"@types/react-addons-test-utils": "0.14.15",
"@microsoft/sp-core-library": "~1.1.0",
"@microsoft/sp-webpart-base": "~1.1.0",
"@microsoft/sp-lodash-subset": "~1.1.0",
"@microsoft/sp-office-ui-fabric-core": "~1.4.0-0",
"@types/webpack-env": "1.13.1",
"@types/es6-promise": "0.0.33"

How do I get the pageContext and the httpClient?

Thanks

Answer 1

From anywhere in the Web Part class (for example the render() method), you should be able to access this.context.pageContext and this.context.spHttpClient or this.context.httpClient.

This would be in the /src/webparts/helloWorld/HelloWorldWebPart.ts file. (Replace HelloWorld with whatever you named your web part.)

Answer 2

Look at the images to see how to get and send pageContext and spHttpClient to you components.

your props should look like this:

Last step is to get them in your component where all code is by just typing this.props.pageContext & this.props.spHttpClient under your render() method.