如何将 onyx.Picker 重置为预选状态

Question

我有一个 onyx.Picker，它在选择之前显示一个 "Click to Select" 按钮，提示用户进行操作。正如预期的行为一样，一旦用户选择了一个选项，他们就无法恢复到 "Click to Select" 显示。但是，我需要能够以编程方式重置表单，在这种情况下，选择器应该再次恢复到它的原始状态。

我发现我可以通过调用 this.$.PickerName.setSelected(null) 删除选择的选项但是，UI 不会像预期的那样恢复到 "Click to Select" 显示。如何完全重置选择器？

Fiddle : http://jsfiddle.net/trex005/2amLu1r4/

Answer 1

据我所知，选择器上的 setSelected() 希望您向它传递对要动态设置的控件（选择器的 clientControls）的引用，因此传递 null 就可以了没有什么。选择项目后，项目列表将关闭，但项目保持选中状态并且 pickerButton 显示所做的选择。所以，你所要做的就是这个。 this.$.pickerButton.setContent('Click to Select'); 这将重置 pickerButton 内容。

http://jsfiddle.net/scrs3Le5/1/

enyo.create({
components: [{
    kind: "onyx.PickerDecorator",
    name: "DecoratorName",
    components: [{
        name:'pickerButton',
        style: 'min-height:2.5rem;min-width:330px;',
        content: "Click to Select"
    }, {
        kind: 'onyx.Picker',
        name: 'PickerName',
        components: [
            {content: "Is broken"},
            {content: "Is not cool"},
            {content: "Is very very very very very very very cool!"}
        ]
    }]
}, {
    kind: 'Button',
    ontap: 'ResetPicker',
    content: 'ResetPicker'
}],
ResetPicker: function () {
    //this.$.PickerName.setSelected(null);
    this.$.pickerButton.setContent('Click to Select');
},
rendered: function () {
    this.inherited(arguments);
}
}).renderInto(document.body);

希望对您有所帮助！

如何将 onyx.Picker 重置为预选状态

How to reset onyx.Picker to pre selected state

javascript

enyo