Kendo UI网格数据变量Vue.js
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Kendo UI网格数据变量Vue.js相关的知识，希望对你有一定的参考价值。
在kendo UI中，可以使用Vue.js中变量的数据加载网格吗？
答案
是的，您可以绑定到数据源属性，而不是使用data-source-ref。这可以是kendo DataSource的实例或简单数组。
例如，这里是default demo，更改为绑定到对象数组。
var products = [{
"ProductID": 1,
"ProductName": "Chai",
"UnitPrice": 18,
"UnitsInStock": 39,
"Discontinued": false
},
{
"ProductID": 2,
"ProductName": "Chang",
"UnitPrice": 19,
"UnitsInStock": 17,
"Discontinued": false
}, {
"ProductID": 3,
"ProductName": "Aniseed Syrup",
"UnitPrice": 10,
"UnitsInStock": 13,
"Discontinued": false
}
];
new Vue({
el: '#app',
data: {
products: products
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.common.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.default.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.default.mobile.min.css" />
<script src="https://kendo.cdn.telerik.com/2017.3.1026/js/kendo.all.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser-polyfill.min.js"></script>
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<script src="https://unpkg.com/@progress/kendo-all-vue-wrapper/dist/cdn/kendo-all-vue-wrapper.min.js"></script>
</head>
<body>
<div id="example">
<div id="app">
<kendo-grid :height="550" :data-source="products">
<kendo-grid-column field="ProductName"></kendo-grid-column>
<kendo-grid-column field="UnitPrice" title="Unit Price" :width="120" :format="'{0:c}'"></kendo-grid-column>
<kendo-grid-column field="UnitsInStock" title="Units In Stock" :width="120"></kendo-grid-column>
<kendo-grid-column field="Discontinued" :width="120"></kendo-grid-column>
</kendo-grid>
</div>
</div>
</body>
</html>另一答案
对的，这是可能的。在网格动作中，尝试@Select并实现函数OnSelect (e)。这是你如何从对象e获取数据。
以上是关于Kendo UI网格数据变量Vue.js的主要内容，如果未能解决你的问题，请参考以下文章
无法使用 customdropdown 读取未定义的 kendo ui js 网格的属性“数据”