How to submit people picker value from Teams to SharePoint

I've created a Teams webpart (hosted in Teams). I'm using an sp/pnp people picker to allow the users to choose a person. I want to submit this to a separate SharePoint site (not the one behind the Team).

Framework: SPFx

The Problem: When I submit the Id (which the Person column in SharePoint requires) it shows nothing because the Id from the Teams based People Picker is different to the one that would be used in the SharePoint site.

I've tried submitting the loginName but the Person column REQUIRES an Id. Attempts:

 const [requestedOnBehalfId, setRequestedOnBehalfId] = useState<any>();
 const [requestedOnBehalfEmail, setRequestedOnBehalfEmail] = useState<any>([]);

 const _createRequest = () => {
        const request = {
            Title: title,
            Department: selectedDept,
            RequestedById: requestedOnBehalfId,
        }
        CreateLineItem(request, props.context);
    };

const _changeRequestedOnBehalf = (items: any) => {
        let userTrim: string = "";
        if (items !== null && items.length > 0) {
            userTrim = items[0].loginName.replace("i:0#.f|membership|","");
            console.log(items[0].id, 'items[0].id');
            console.log(items[0], 'items[0]');
            console.log(userTrim, 'userTrim');
            setRequestedOnBehalfId(userTrim);
            // setRequestedOnBehalfEmail([userTrim]);
        } else {
            setRequestedOnBehalfId(null);
            setRequestedOnBehalfEmail(null);
        }
    };

What can I use?

Each "site" has it's own internal database of users, which means that, frustratingly, the same user will have a whole bunch of different IDs across the SharePoint environment - exactly what you're seeing. It's easy to resolve though, using the pnp js library (part of the same family as the pnp people picker you're using already).

On that library is a method to:

a. confirm if the user's record exists in the specific site b. add it if it doesn't exist, and c. return the result, which includes the user's id specific to the site you're connecting to.

See more at https://pnp.github.io/pnpjs/sp/webs/#ensureuser