title: Is it possible to get the assigned ref name in a component? Vue.js
body: <p>I created a new component that will render a chart using <a href="https://www.chartjs.org/" rel="nofollow noreferrer">Chart.js</a>. I would like to access this component via a reference.</p>
  <pre><code>&lt;kpis-linechart name=&quot;inv-speed&quot; ref=&quot;inv-speed-chart&quot; :information=&quot;team.invoice_details&quot;&gt;
  </code></pre>
  <p>A chart with <code>chart.js</code> is created using <code>&lt;canvas id=&quot;chart-id&quot;&gt;&lt;/canvas&gt;</code> in the html.</p>
  <p>I would like assign the chart id the same value as the ref value.</p>
  <p>Is there a way to get the ref. name from the component ?</p>
  <p>Example : <code>this.$ref_name</code></p>
  <p>This is my code so far :</p>
  <pre><code>Vue.component('kpis-linechart',{
  
      template : '#kpis-linechart-template',
  
      props : {
          information : Object,
          name : String
      },
      // I WANT TO REPLACE THIS CODE IN ORDER TO GET THE REF NAME AS ID //
      // I WANT TO REPLACE THIS CODE IN ORDER TO GET THE REF NAME AS ID //
      computed : {
          id_chart(){
              return this.name + '-chart'
          }
      },
  
  
      methods : {
          updateChart(){
              this.chart = new Chart(document.getElementById(this.id_chart),{
                  type : 'line',
                  data : {
                      labels : ['hola','como','estas'],
                      datasets : [
                          {
                              label : 'Queso',
                              data : [1,2,4]
                          }
                      ]
  
                      
                  }
              })
          }
      },
  
      mounted(){
          this.updateChart()
          console.log('CREATING CHART')
          // console.log(this.information)
          console.log(this)
      }
  
  })
  </code></pre>