vue-multi-ref v2.0.1

This is a directive to help use same ref on more than one element.

Big thanx to @Herteby & @LinusBorg. :fire::metal::clap:

original post.

Installation

npm install vue-multi-ref --save

Usage

• register the directive

  import Vue from 'vue'
  import 'vue-multi-ref'
  
  new Vue({ el: '#app' })

  or using Vue as global variable

  window.Vue = require('vue')
  require('vue-multi-ref')
  
  new Vue({ el: '#app' })

• now add v-multi-ref:refName to any number of elements that you want to have the same ref, ex.

  • refName could be - camelCase = refName - kebab-case = ref-name - snake-case = ref_name

    <div v-multi-ref:my-ref>a</div>
    <li v-multi-ref:my-ref>b</li>
    <a v-multi-ref:my-ref>c</a>

• result

  // console.log(this.$refs['my-ref'])
  
  > my-ref: (3) [div, li, a]