javascript - 如何锁定 Kendo UI Vue Grid 中的列( native )

标签 javascript vue.js kendo-ui kendo-grid

我正在尝试使用 Native Grid 将列固定/锁定到左侧

我想避免使用 Wrapper,因为我的表是由最终用户动态配置的。问题是属性 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"
  }
];

结果:

enter image description here

最佳答案

刚刚发布的 Kendo UI Vue Grid( native )中的锁定列,您可以查看此 stackblitz example 中的演示.

(初始答案)锁定列在新的 Kendo Native(不依赖于 jQuery)Vue Grid 中尚不可用,但它们已经处于“准备测试”状态,可能会在下周提供。此功能推出后,我会更新我的答案。

关于javascript - 如何锁定 Kendo UI Vue Grid 中的列( native ),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54443080/

相关文章:

javascript - If 和 Else 语句始终输出 If

javascript - 使用 javascript 从 php 获取 id

javascript - 日期选择器范围工作错误

charts - Kendo ui图表隐藏数据点的圆圈

javascript - Kendo UI 网格在下拉选择时刷新

javascript - d3 树状图工具提示的自定义样式

javascript - socket.io CORS access-control-allowed-origin 设置为 *

javascript - 检查当前事件元素是否是任何类型的输入

javascript - 从 Action 内部而不是通过突变设置 Vuex 属性的值是错误的吗?

javascript - Vuejs : How to display selected <li> element in ul dropdown menu