我正在使用 Kendo UI 的 Vue 包装器，无法在 Chrome 中进行排序。 我正在尝试将我的数据分组到站点中，并按这些站点中的类别对行进行排序。 我在 Vue 中的第一列是隐藏的，带有类别索引对它们进行排序：
<kendo-grid-column field="___categorySortingIndex" :hidden="true"></kendo-grid-column>
如果我没有在我的数据源上启用分组，那么它会按预期在索引号之后对所有类别进行排序。
我正在处理的问题仅在对项目进行分组时发生：
group: {
field: "___siteSortingIndex",
dir: "asc"
}
有一个使用 Kendo jQuery 的教程，但该功能似乎不适用于 vue 组件，因为 vue 使用模板语法而不是像 jQuery 示例那样的对象数组。
jQuery教程解决方案：
...
columns: [{
field: "Name"
}, {
field: "Address",
sortable: {
compare: function(a, b, descending) {
if(a.Address !== b.Address)
{
return a.Address - b.Address;
}
if (descending) {
return b._position - a._position;
} else {
return a._position - b._position;
}
}
}
}]
...
尝试在 Vue 中执行此操作：
<kendo-grid-colum :sortable="sortableObject" ...>
...
sortableObject = {
compare: ( a, b, descending ) => {
...
}
};
...
将可排序属性设置为对象会给出以下警告：
[Vue 警告]：无效道具：道具"可排序"的类型检查失败。预期的布尔值，得到对象。
有没有办法使用 vue 包装器对 chrome 进行稳定排序 剑道 ui？
网格列中的:sortable属性仅采用Boolean类型。
但是，有一个:sortableCompare属性采用一个Function，该属性应以与您发布的 jQuery 示例类似的方式返回带有sortable.compare的对象。
我通过听@databinding事件解决了这个问题：
<kendo-grid ... @databinding="onDataBinding" ...>
此事件在呈现模板之前运行，然后可以在 kendo vue 模板中使用数据之前对数据进行排序：
onDataBinding( e ) {
forEach( e.items, item => {
item.items.sort( ( a, b ) => a.___categorySortingIndex - b.___categorySortingIndex );
} );
}
我不能说这是否被认为是坏的，但它确实适用于我需要它做的事情。