如何锁定 Kendo UI Vue Grid 中的列（本机）

Question

我正在尝试使用 Native Grid pin/lock 左侧的一列

我想避免使用 Wrapper，因为我的 table 是由最终用户动态配置的。问题是属性 locked 似乎被完全忽略了。

HTML

<Grid ref="grid" 
  :style="{height: 'auto'}" 
  :data-items="items" 
  :resizable="true" 
  :columns="columns" 
  :edit-field="'inEdit'"></Grid>

数据

items = [
  {"column1": "1", "inEdit": true},
  {"column1": "2", "inEdit": true},
  {"column1": "3", "inEdit": true}
];
columns = [{
    "minResizableWidth": 50,
    "width": 100,
    "title": "Column 1",
    "field": "column1",
    "sortable": true,
    "editable": true,
    "locked": true,
    "editor": "text"
  },
  {
    "minResizableWidth": 50,
    "width": 200,
    "title": "Column 2",
    "field": "column2",
    "sortable": true,
    "editable": true,
    "editor": "text"
  },
  {
    "minResizableWidth": 50,
    "width": 200,
    "title": "Column 3",
    "field": "column3",
    "sortable": true,
    "editable": true,
    "editor": "text"
  }
];

结果：

Answer 1

Kendo UI Vue Grid（本机）中的锁定列刚刚发布，您可以在此 stackblitz example.

中查看演示

（初始答案）锁定的列在新的 Kendo Native（不依赖于 jQuery）Vue Grid 中尚不可用，但它们已经处于 'ready for test' 状态并且将可能下周有空。一旦此功能结束，我将更新我的答案。

如何锁定 Kendo UI Vue Grid 中的列（本机）

How to lock a column in Kendo UI Vue Grid (native)

javascript

kendo-ui

kendo-grid

vue.js