SPFx - Wrong function return current user formatted name

Question

I'm beginner with TS and promises. I want to know Why function is returning empty string?

How to format my function to return current user formatted name? The request is executed after the function has been executed

Answer 1

You dont need to query user profile to get the login name or display name.

It is already available inside the this.context.pageContext.user object.

Try and modify the below sample code. You can get the login name, display name as well as email without making a REST call to user profile:

public render(): void {
const element: React.ReactElement<any> = React.createElement(
   HelloWorld,
   {
     userLoginName: this.context.pageContext.user.loginName,
     userDisplayName: this.context.pageContext.user.displayName,
     email : this.context.pageContext.user.email,
     context: this.context
   }
);

 ReactDom.render(element, this.domElement);
}