reactjs - 如何在反应框架中使用 mgt-people-picker
问题描述
我正在尝试mgt-people-picker
在我的 SPFx Webpart 中使用 React 框架,但无法使selected-people
属性工作。我尝试将一组图形用户对象传递给它,但没有运气。
当我尝试使用
document.querySelector('mgt-people-picker').selectUsersById(["id","id"])
它抛出了一个错误说"Property 'selectUsersById' does not exist on type 'Element'"
文档非常有限且不清楚,我找不到太多参考资料。谁能告诉我如何使用它?
解决方案
React 以 HTML 属性的形式将所有数据传递给 Web 组件。对于原始数据,这很好,但在传递丰富的数据(如对象或数组)时不起作用。在这些情况下,您将需要使用 ref 来传递对象。查看文档
这是一个通过 id 设置用户的示例:
export default class HelloWorld extends React.Component<IHelloWorldProps, {}> {
public render(): React.ReactElement<IHelloWorldProps> {
return (
<mgt-people-picker ref="peoplePicker"></mgt-people-picker>
);
}
componentDidMount() {
if (this.refs.peoplePicker) {
let peoplePicker = this.refs.peoplePicker as MgtPeoplePicker;
peoplePicker.addEventListener('selectionChanged', e => console.log(peoplePicker.selectedPeople));
peoplePicker.selectUsersById(['4782e723-f4f4-4af3-a76e-25e3bab0d896']);
}
}
}
推荐阅读
- angular - FormArray 将值返回为数组数组而不是 Angular 中的对象数组
- c# - 如何使继承类的构造函数在类的构造函数之后运行
- reactjs - react 没有通过 redux 数组映射
- mysql - (我如何)Azure 数据工厂到(本地)使用证书的 mysql 数据库连接
- jquery - 更改图片来源不适用于变量
- c# - Unity - CommandInvokationFailure:Gradle 构建失败
- mysql - Docker Compose 与 MySQL 发生错误
- python - 使用Pygame让子弹以一定速度跟随移动物体?
- ios - iOS 推送通知仅由开发设备接收
- ssl - 在 z/os 上实现 ssl