Vuejs can't access refs from component

The created is fired before the template is processed.
You can find more details here: https://vuejs.org/v2/guide/instance.html#Lifecycle-Diagram

You should be able to access the $refs on the mounted event

mounted: function() {
    console.log(this.$refs.icanvas);
},

You can use $nextTick() function, code inside $nextTick() will run after DOM update.

this.$nextTick(function () {

    console.log(this.$refs.ANY_COMPONENT_REF)

})

i had the exact same issue, in my case i solved it by accessing the ref in the method that changes the v-if with nextTick.

methods: {
open() {
  this.show = true; //v-if condition
    this.$nextTick(function() {
      this.titleWidth = this.$refs.titleBg.clientWidth - 30;
    });
}