我有一个包含所有状态的父级组件和2个无状态子级组件。我将状态传递给2个子组件作为道具。我受困于应该在相关子组件的props接口中处理的prop类型。这是我目前所拥有的:
export interface IPage1Props {
context: WebPartContext;
ppfullname: string;
ppfullnametoChange(value: any): void;
这是子组件人员选择器:
<PeoplePicker
context={this.props.context}
personSelectionLimit={1}
groupName={''} // Leave this blank in case you want to filter from all users
showtooltip={false}
isRequired={false}
disabled={false}
selectedItems={this._getPeoplePickerItems}
defaultSelectedUsers={this.props.ppfullname}
principalTypes={[PrincipalType.User]}
resolveDelay={1000}
ensureUser={true}
/>
以下是附加到孩子中的人选择器上的功能:
private _getPeoplePickerItems(items) {
this.props.ppfullnametoChange(items);
}
这是父级中的处理函数:
private _onPPFullNameToChange(items : any){
this.setState({
PPFullName:items[0].id,
PeoplePickerDefaultItems:[items[0].secondaryText]
});
}
实际的PP字段的状态为PPFullName。顺便说一句,我从未完全清楚为什么需要[items [0] .secondaryText ??!
这是我传递给子组件的内容:
ppfullname={this.state.PPFullName}
ppfullnametoChange={this._onPPFullNameToChange}
任何指导表示赞赏。
更新:我正在Childs渲染中从Parent记录PP的功能,因此似乎该功能正在传递给孩子:
function (items) {
this.setState({
PPFullName: items[0].id,
PeoplePickerDefaultItems: [items[0].secondaryText]
});
}
但是如何利用它呢?
T