【问题标题】:Office UI Fabric - PeoplePicker: Cannot get createGenericItem to workOffice UI Fabric - PeoplePicker:无法让 createGenericItem 工作
【发布时间】:2019-01-29 21:08:16
【问题描述】:

也许这只是我的一个误解,但我认为 PeoplePicker (https://developer.microsoft.com/en-us/fabric#/components/peoplepicker) 中 createGenericItem 的回调用于处理输入,无法与任何可用项目匹配,然后给出为此创建一个临时项目的可能性。但是,无论我尝试什么,都不会调用回调。

我在这里为这个问题做了一个简单的笔:https://codepen.io/anon/pen/daGPWe?editors=0010

在示例中,有两个项目,彼得和玛丽亚。如果您输入不同的内容(然后按 Enter、制表符、空格等),我希望会调用 createGenericItem 回调,但事实并非如此。

我做错了什么?还是对这个回调的目的有误解?我无法在任何地方找到示例。

【问题讨论】:

    标签: office-ui-fabric


    【解决方案1】:

    关于

    但我认为 PeoplePicker 中 createGenericItem 的回调 (https://developer.microsoft.com/en-us/fabric#/components/peoplepicker) 用于处理输入

    没错。为了触发IBasePickerProps.createGenericItem函数,IBasePickerProps.onValidateInput函数需要提供ValidationState.valid作为返回值,例如:

    <NormalPeoplePicker
          createGenericItem={this.createGenericItem}
          onValidateInput={this.handleValidateInput}
          selectedItems={this.state.selectedItems}
          onResolveSuggestions={this.handleResolveSuggestions}
          onChange={this.handleChange}
    />
    
    
    private handleValidateInput(input: string) {
       return ValidationState.valid;
    }
    
    private createGenericItem(input: string, validationState: ValidationState) {
       return { text: "Unknown person",  state: validationState };
    }
    

    This demo 演示它,一旦单击 tabenter 键并且值无法解析为任何可用项目,Unknown person 项目正在显示

    【讨论】:

    • 非常感谢。正是我所缺少的:-)
    • 只是出于好奇:您是否在文档中的某个地方阅读过此内容,或者是否有其他资源可以推荐 Office UI 上的良好示例?
    • 嗯,是我不小心删了你的评论还是你自己删的?
    • 我做到了 ;),想将其改写为:源代码加上相当好的 cmets 覆盖率到目前为止,这是弄清楚如何使用未记录功能的最可靠方法
    • 好的,很好。我只是回答说谢谢,而这就是我担心的情况,当您的评论突然消失时:-)想知道我是否误按了某个按钮...所以谢谢:-)
    猜你喜欢
    • 2017-06-05
    • 2021-04-02
    • 2020-09-13
    • 2020-04-23
    • 2018-10-31
    • 1970-01-01
    • 1970-01-01
    • 2021-08-10
    • 1970-01-01
    相关资源
    最近更新 更多