import {
PeoplePicker,
PrincipalType,
} from "@pnp/spfx-controls-react/lib/PeoplePicker";
import * as React from "react";
//People Picker Component
const PeoplepickerForm = ({
context,
onChange,
limit,
groupName,
peoplePickerData
}:any) => {
return(<>
<PeoplePicker
context={context}
placeholder="Enter Name or EmailID"
defaultSelectedUsers={peoplePickerData}
personSelectionLimit={limit}
showtooltip={false}
required={true}
groupName={groupName}
disabled={false}
showHiddenInUI={false}
ensureUser={true}
principalTypes={[PrincipalType.User]}
resolveDelay={1000}
onChange={onChange}
/>
</>)
}
export default PeoplepickerForm;
this was my peoplepicker component and
const getData = async(id:number) => {
let url = `${props.webURL}/_api/lists/getbytitle('Employee')/items?$select=ReportingManagerId,ReportingManager/Title,&$expand=ReportingManager,&$filter=ID eq ${id}&$orderby=ID desc`
const data = await ListOperations.getPageList(props.context,url)
console.log(data)
if(data.value.length > 0){
let temp : any[] = []
let url = props.webURL.split("/")
data.value.map(async(d:any)=> {
setReportingManager([{title : d.ReportingManager.Title, id : d.ReportingManagerId}])
// setReportingManager(d.ReportingManagerId)
await _getPeoplePickerItems([d.ReportingManagerId])
})
}
}
const _getPeoplePickerItems = (items: any[]) => {
let getSelectedUsers = "";
for (let item in items) {
getSelectedUsers = items[item].id;
}
and from this function I'm getting data with reportermangerid
and this reporter manager I want to set in peoplepicker component so how can I do it?