pnp/sp PeoplePicker 中的必需屬性不起作用

Question

我對 pnp/sp PeoplePicker 有疑問。 PeoplePicker 具有“必需”屬性，但是當我在表單中使用它時，它會被忽略。

這是我的 PeoplePicker 代碼：

<PeoplePicker
required={true}
context={this.props.spContext}
personSelectionLimit={1}
onChange={this.hcRequestorPP}
showHiddenInUI={false}
principalTypes={[PrincipalType.User]}
ensureUser={true}
resolveDelay={1000}
defaultSelectedUsers={this.props.pRequestor}
disabled={false} />

我究竟做錯了什么？

謝謝你，Matjaz Reberc

Answer 1

Helo，您沒有做錯任何事情：-) 根據我的知識，必需的屬性將星號放在人員選擇器 label 旁邊 - 僅此而已。

如果您想在表單中檢查用戶是否在人員選擇器字段中輸入了某些內容，則必須自己檢查。

我的表格版本是：

1. 每個表單值都存儲在 state 中。
2. 每個表單字段及其定義（名稱、類型、必需...）都存儲在 props（或 state 或 const 等）中。
3. 在提交表格之前，我正在檢查是否填寫了每個必需的值（下面的代碼）
4. 如果未填寫，我會在該字段下放置錯誤消息。

開始的好例子是： https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-list-form

需要檢查

let requiredError: boolean = false;
let fieldErrors: { [fieldName: string]: string } = {...this.state.fieldErrors};
// check required
for (let i: number = 0; i < this.state.fieldsSchema.length; i++) {
  if ((this.state.fieldsSchema[i].Required) && (!this.state.data[this.state.fieldsSchema[i].InternalName]) && (this.state.fieldsSchema[i].InternalName !== 'Aktivita')) {
    requiredError = true;
    fieldErrors = {
      ...fieldErrors,
      [this.state.fieldsSchema[i].InternalName]: strings.FormFields.RequiredValueMessage
    };
  }
}
if (requiredError === true) {
  this.setState({
    ...this.state,
    fieldErrors: fieldErrors,
    requiredFieldEmpty: requiredError
  });
  return;
}