New to Kendo UI for Vue? Start a free 30-day trial
GridNoRecords
Represents the GridNoRecords component which is rendered
when the data
property of the Grid is empty or null
.
<div id="app">
<Grid
:data-items="products"
:columns="columns">
<grid-norecords>
There is no data available custom
</grid-norecords>
</Grid>
</div>
<script>
Vue.component('Grid', Grid);
Vue.component('grid-norecords', GridNoRecords);
new Vue({
el: '#app',
data: function () {
return {
products: [
{ 'foo': 'A1', 'bar': 'B1' },
{ 'foo': 'A2', 'bar': 'B2' },
{ 'foo': 'A3', 'bar': 'B2' }
],
columns: [
{ field: 'foo'},
{ field: 'bar'}
]
};
}
});
</script>