Vuejs не может получить доступ к ссылкам из компонента

Я пытаюсь получить элемент canvas, который находится внутри шаблона компонента, нашел отличную документацию для vuejs1, но не для vuejs2, где «ref» - ​​единственный способ получить элемент. Я получаю объект, хотя, но когда я пытаюсь получить доступ к переменной, он не определен.

Мой HTML

<div id="app>
  <template id="image-capture">
    <div class="row" >
      <canvas ref="icanvas" ></canvas>
    </div>
  </template>
</div>

Мой JS

const ic = {
  template: '#image-capture' ,

  created () {
    console.log(this.$refs); //this returns object
    console.log(this.$refs.icanvas); // but this is undefined
  }


}

const routes = [
  { path: '/ic', component:   ic},
]

const router = new VueRouter({
  routes 
})

 new Vue({
  router,
   }).$mount('#app')

Мне нужно получить элемент icanvas.

Ответы на вопрос(4)

Ваш ответ на вопрос