Ошибка типа: this.$ Refs.datasource.fetch не является функцией
Я пытаюсь вызвать метод fetch для источника данных, созданного с помощью vue-оболочки.
Ошибка [Vue warn]: Ошибка в подключенном хуке: "Ошибка типа: this.$ Refs.datasource.fetch не является функцией". Поэтому мой вопрос заключается в том, как я могу вызывать методы из объекта $refs.
Я сделал здесь стек
<body>
<div id="vueapp" class="vue-app">
<kendo-datasource ref="datasource" :data="dataSourceArray">
</kendo-datasource>
</div>
</body>
new Vue({
el: '#vueapp',
data: function() {
return {
dataSourceArray: [
{ text: 'Albania', value: '1' },
{ text: 'Andorra', value: '2' },
{ text: 'Armenia', value: '3' },
{ text: 'Austria', value: '4' },
{ text: 'Azerbaijan', value: '5' },
{ text: 'Belarus', value: '6' },
{ text: 'Belgium', value: '7' }
]
}
},
mounted: function () {
this.$refs.datasource.fetch()//<== error here
}
})
1 ответ
Решение
Реф, который вы получаете, это весь <kendo-datasource>
компонент, который не имеет fetch()
метод. Я полагаю, что вы пытаетесь сделать, это получить kendoDataSource внутри компонента и вызвать для него метод fetch, который будет:
this.$refs.remoteDatasource.kendoDataSource.fetch();
измените ваш пример, чтобы увидеть его в действии:
<kendo-datasource
ref="datasource"
:data="dataSourceArray"
:type="'odata'"
:transport-read-url="'https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers'">
</kendo-datasource>
this.$refs.remoteDatasource.kendoDataSource.fetch(function(){
var data = this.data();
console.log(data[0]);
});
}