在 Kendo UI Dropdownlist 上使用值绑定时将 Onservable 重置为 null

Question

我通过将小部件绑定到 Observable 对象来启动Kendo UI Dropdown List。如果我的下拉列表中的 valuePrimative 属性设置为 false，如何在进行选择后将值绑定“重置”为 null？

HTML：

    <select 
        data-role="dropdownlist" 
        data-text-field="name" 
        data-value-field="id" 
        data-option-label="Select to add..."
        data-bind="source: rootData, value: selectedValue">
    </select>
    <button class='add-to-list-button k-button k-add' data-bind="click: add enabled: selectedValue">+</button>

可观察：

    this.widgetObservable = kendo.observable({
        rootData: this.rootData,
        selectedValue: null,
        myList: [],
        delete: (e) => {
            this.deleteItem(e);
        },
        add: (e) => {
            this.addItem(e);
        }
    });

重置下拉列表中的选定选项（$('select', this.$container).data('kendoDropDownList').select(0) 确实会重置我的下拉列表，但不会清除我的 selectedValue 变量。

如果 valuePrimitive 选项设置为 true，我可以将 selectedValue 变量重置为 -1，这确实会重置变量并禁用我的按钮，但这意味着下拉菜单返回的值将是原始的，迫使我去某个映射对象中寻找原始对象。

理想情况下，当我选择一个值并单击“添加”按钮时，我想基本上对所选对象执行操作，然后将下拉列表重置为其原始状态。

如果我想清除选择，我已经看到它建议使用Combobox instead of a Dropdown，因为下拉菜单总是有一个选定的值（这是有道理的），但这引出了一个问题，在初始加载后选择了什么（在任何之前选择），为什么我不能重置为初始值？另外，我不想要组合框附带的额外功能。

我不应该为按钮上的enabled 绑定而烦恼吗？

Answer 1

你应该可以的

delete: function(e) {
    this.set('selectedValue', null);
}

如果您使用 (e) => {} 语法，您的 this 将不会是可观察的，所以要小心。

您的下拉菜单应通过 mvvm 对此做出反应。