question

MohammadIsmailAnsari-3784 avatar image
0 Votes"
MohammadIsmailAnsari-3784 asked MichaelHan-MSFT commented

SharePoint Framework WebPart Issue

We have a SPFx webpart added on modern site. Previously it was working fine but from last 2-3 days, we are getting error and webpart is not rendering. In workbench same webpart is working fine. When we failed to resolve the issue then we removed the webpart from app catalog but still showing on page with error.

Please help me to resolve the issue

office-sharepoint-online
· 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.

What error messages did you actually get? please share more details

0 Votes 0 ·
MohammadIsmailAnsari-3784 avatar image
0 Votes"
MohammadIsmailAnsari-3784 answered MohammadIsmailAnsari-3784 commented

I am trying to get user and web details from context. but I am getting error with pageContext of undefined.

· 6
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.

And the same code working fine in workbench.

0 Votes 0 ·
MichaelHan-MSFT avatar image MichaelHan-MSFT MohammadIsmailAnsari-3784 ·

What code did you use to get user and web details from context?

0 Votes 0 ·

I have setup context in my Webpart file. then using as a props in rest file.

this.props.context.pageContext.user.email;
this.props.context.pageContext.web.absoluteUrl

0 Votes 0 ·
Show more comments
MichaelHan-MSFT avatar image
0 Votes"
MichaelHan-MSFT answered

Hi @MohammadIsmailAnsari-3784,

Below is my sample code to setup the pageContext. You could have a try to setup pageContext instead of context, check if it works for you.

 import { PageContext } from '@microsoft/sp-page-context';
    
 export interface IHelloWorldProps {
   description: string;
   pageContext: PageContext;
 }

Then pass pageContect from Render method of SPFx web part:


   public render(): void {
     const element: React.ReactElement<IHelloWorldProps> = React.createElement(
       HelloWorld,
       {
         description: this.properties.description,
         pageContext: this.context.pageContext
       }
     );
                
     ReactDom.render(element, this.domElement);
   }

In Component, get the user information like this: this.props.pageContext.user.email


If an Answer is helpful, please click "Accept Answer" and upvote it.
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.

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.

MohammadIsmailAnsari-3784 avatar image
0 Votes"
MohammadIsmailAnsari-3784 answered MichaelHan-MSFT commented

I am using the same instead of pageContext, I am using context: this.context only because I am doing some other operation too.

· 4
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.

I set up context like the below:

 import { WebPartContext } from '@microsoft/sp-webpart-base';
    
 export interface IHelloWorldProps {
   description: string;
   //pageContext: PageContext;
   context: WebPartContext;
 }

What's type of context did you use? Are you using any? Try to use WebPartContext instead.





0 Votes 0 ·

Yes.. I have also setup the same.

0 Votes 0 ·

import { WebPartContext } from "@microsoft/sp-webpart-base";

context: WebPartContext;
description: string;

and see my code is working in SharePoint workbench and not working in site pages after deployment. Previously It was working fine in both places but last 2-3 days it's not working.

0 Votes 0 ·
MichaelHan-MSFT avatar image MichaelHan-MSFT MohammadIsmailAnsari-3784 ·

Per my test, this works for me on my end. Have you tried to upgrade your project to the latest?

0 Votes 0 ·