kendo-vue下拉列表在窗口内不工作

Question

我已经为此挣扎了几个小时，但我没有找到任何方法让它工作。

问题是，如果你把下拉列表放在一个窗口中，它就不能工作了。这里有一个示例。

https://plnkr.co/edit/eBpc4kEcHr7uSq6Zdq6h?p=preview

<kendo-window :width="'300px'" :title="'Window title'" :visible="visible" style="display:none">

​

<kendo-datasource ref="datasource" :type="'odata'" :transport-read-url="'https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products'">
</kendo-datasource>

<kendo-dropdownlist :data-source-ref="'datasource'" :data-text-field="'ProductName'" :data-value-field="'ProductID'" :placeholder="'Select product'">
</kendo-dropdownlist>

">https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products'">

有解决这个问题的办法吗？

致以问候。

Answer 1

我看不出你正在尝试的东西有什么问题，但它可以在internal slot datasource上工作

  <kendo-window
          :width="'300px'"
          :title="'Window title'"
          :visible="visible"
          style="display:none">

      <kendo-dropdownlist
              :data-text-field="'ProductName'"
              :data-value-field="'ProductID'"
              :option-label="'Select product'">

          <kendo-datasource
                  slot="kendo-datasource"
                  :type="'odata'"
                  :transport-read-url="'https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products'">
          </kendo-datasource>

      </kendo-dropdownlist>

  </kendo-window>

Answer 2

它看起来像是一个bug --我已经把它记录在here上了。您可以临时使用内部插槽(如rareclass所建议的)作为here

 <kendo-window :width="'300px'"
              :title="'Window title'"
              :visible="visible"
              style="display:none">
    <h4>Window content</h4>
        <kendo-dropdownlist style="width: 100%" :data-text-field="'ContactName'" >
        <kendo-datasource slot="kendo-datasource"
                          :type="'odata'"
                          :transport-read-url="'https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers'"
                          :group-field="'Country'">
        </kendo-datasource>
   </kendo-dropdownlist>
</kendo-window>