title: TypeError: this.$refs.datasource.fetch is not a function
body: <p>I am trying to call the <a href="https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/methods/fetch" rel="nofollow noreferrer">fetch</a> method on a data source created with <a href="https://www.telerik.com/kendo-vue-ui/components/datasource/datasource/data-binding/" rel="nofollow noreferrer">a vue wrapper</a>.</p>
  
  <p>The error is <strong>[Vue warn]: Error in mounted hook: "TypeError: this.$refs.datasource.fetch is not a function"</strong> So my question is how can I call methods from the $refs object.</p>
  
  <p>I made a stackblitz <a href="https://stackblitz.com/edit/saeqlu" rel="nofollow noreferrer">here</a></p>
  
  <pre><code>&lt;body&gt;
      &lt;div id="vueapp" class="vue-app"&gt;
          &lt;kendo-datasource ref="datasource" :data="dataSourceArray"&gt;
          &lt;/kendo-datasource&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  
  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()//&lt;== error here
      }
  })
  </code></pre>