第一个选择上的DevExtreme DropDownBox问题已更改

Question

我一直在学习如何使用DevExteme HTML5小部件。除了数据来自远程here之外，我遵循了代码示例API。

代码是：

let containerForRemoteObjectDropDown = document.createElement("div");

var dropOptions4 = {
  value: 10409,
  valueExpr: "orderId",
  valueExpr: "shipCountry",
  dataSource: {
    store: AspNetData.createStore({
      loadUrl: "https://localhost:44341/nwind/orders",
      key: "orderId"
    }),
    sort: "shipCountry",
    paginate: true,
    pageSize: 100 // group
  },
  contentTemplate: function(e) {
    let divForGrid = document.createElement("div");
    var grid = new DataGrid(divForGrid, {
      dataSource: e.component.option("dataSource"),
      columns: ["orderId", "shipCountry"],
      height: 265,
      selection: { mode: "single" },
      selectedRowKeys: [selectedValue],
      onSelectionChanged: function(selectedItems) {
        var keys = selectedItems.selectedRowKeys,
          hasSelection = keys.length;
        e.component.option("value", hasSelection ? keys[0] : null);
        e.component.close();
      }
    });
    return divForGrid;
  }
};

container.appendChild(containerForRemoteObjectDropDown);

let remoteDatadropDownInstance = new DropDownBox(
  containerForRemoteObjectDropDown,
  dropOptions4
);

问题是，当您第一次单击DropDownBox时，会触发onSelectionChanged事件，并关闭小部件的下拉部分。这是在你实际选择了likst中的一个项目时发生的，而不是当你点击小部件第一次调用控件的下拉部分时发生的。

这是它的动画gif：

​

​

有谁知道我可能做错了什么吗？

Answer 1

当集成下拉菜单时，我有相同的问题。与此代码https://js.devexpress.com/Demos/WidgetsGallery/Demo/DropDownBox/SingleSelection/jQuery/Light/相同

此阶段数据绑定时从api调用，而不是与静态js文件绑定。然后我做了下面的一些更改。

Answer 2

​

此阶段数据绑定时从api调用，而不是与静态js文件绑定。然后我做了下面的一些更改。