如何在 PeoplePicker 中获得新的角色行为
How To Get New Persona Behavior in PeoplePicker
文档允许您输入任何字符串,按 [Tab] 键,它将显示为角色。试图复制此行为,但遇到了问题,示例代码什么也没说。
https://developer.microsoft.com/en-us/fabric#/components/peoplepicker
我的人员选择器:
<CompactPeoplePicker
getTextFromItem={(item) => { return item.text; } }
onItemSelected={(item) => {
console.log(item);
return new Promise((resolve, reject) => {
resolve(item);
})
}}
selectedItems={this.state.currentSelectedItems}
onChange={(items) => {
console.log(items);
this.setState({ currentSelectedItems: items});
}}
onResolveSuggestions={this._onResolveSuggestions}
className={'ms-PeoplePicker'}
pickerSuggestionsProps={{
suggestionsHeaderText: 'Suggested People',
mostRecentlyUsedHeaderText: 'Suggested Contacts',
noResultsFoundText: 'No results found',
loadingText: 'Loading',
showRemoveButtons: true,
suggestionsAvailableAlertText: 'People Picker Suggestions available',
suggestionsContainerAriaLabel: 'Suggested contacts'
}}
/>
答案是 return 一个新的 Persona
作为 onResolveSuggestions
的一部分
_onResolveSuggestions = (filterText, ...) => {
var suggestions = ...;
suggestions.splice(0, 0, { name: filterText, text: filterText });
return suggestions;
}
文档允许您输入任何字符串,按 [Tab] 键,它将显示为角色。试图复制此行为,但遇到了问题,示例代码什么也没说。
https://developer.microsoft.com/en-us/fabric#/components/peoplepicker
我的人员选择器:
<CompactPeoplePicker
getTextFromItem={(item) => { return item.text; } }
onItemSelected={(item) => {
console.log(item);
return new Promise((resolve, reject) => {
resolve(item);
})
}}
selectedItems={this.state.currentSelectedItems}
onChange={(items) => {
console.log(items);
this.setState({ currentSelectedItems: items});
}}
onResolveSuggestions={this._onResolveSuggestions}
className={'ms-PeoplePicker'}
pickerSuggestionsProps={{
suggestionsHeaderText: 'Suggested People',
mostRecentlyUsedHeaderText: 'Suggested Contacts',
noResultsFoundText: 'No results found',
loadingText: 'Loading',
showRemoveButtons: true,
suggestionsAvailableAlertText: 'People Picker Suggestions available',
suggestionsContainerAriaLabel: 'Suggested contacts'
}}
/>
答案是 return 一个新的 Persona
作为 onResolveSuggestions
_onResolveSuggestions = (filterText, ...) => {
var suggestions = ...;
suggestions.splice(0, 0, { name: filterText, text: filterText });
return suggestions;
}