title: binding a ref does not work in vue.js?
body: <p>When I v-bind a element-ref with <code>:ref="testThis"</code> it stops working it seems. Compare <a href="https://codesandbox.io/s/9437494r5w" rel="nofollow noreferrer">this version</a> which works:</p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt;
          &lt;q-btn round big color='red' @click="IconClick"&gt;
          YES
          &lt;/q-btn&gt;
          &lt;div&gt;
              &lt;input
                  ref="file0"
                  multiple
                  type="file"
                  accept=".gif,.jpg,.jpeg,.png,.bmp,.JPG"
                  @change="testMe"
                  style='opacity:0'
              &gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import { QBtn } from 'quasar-framework'
  
  export default {
    name: 'hello',
      components: {           
           QBtn
      },
      data () {
      return {
        file10: 'file0'
      }
    },
    methods: {
      IconClick () {
        this.$refs['file0'].click()
      },
          testMe () {
              console.log('continue other stuff')
          }
      }
  }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>With <a href="https://codesandbox.io/s/oqyll10z9z" rel="nofollow noreferrer">this one</a> which DOES NOT work:</p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt;
          &lt;q-btn round big color='red' @click="IconClick"&gt;
          YES
          &lt;/q-btn&gt;
          &lt;div&gt;
              &lt;input
                  :ref="testThis"
                  multiple
                  type="file"
                  accept=".gif,.jpg,.jpeg,.png,.bmp,.JPG"
                  @change="testMe"
                  style='opacity:0'
              &gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import { QBtn } from 'quasar-framework'
  
  export default {
    name: 'hello',
      components: {           
           QBtn
      },
      data () {
      return {
        file10: 'file0'
      }
    },
    methods: {
      IconClick () {
        this.$refs['file0'].click()
      },
          testThis () {
              return 'file0'
          },
          testMe () {
              console.log('continue other stuff')
          }
      }
  }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>The first one works. The second one throws an error:</p>
  
  <pre><code>TypeError: Cannot read property 'click' of undefined
      at VueComponent.IconClick
  </code></pre>
  
  <p>As I would like to vary the ref based on a list-index (not shown here, but it explains my requirement to have a binded ref) I need the binding. Why is it not working/ throwing the error? </p>