Miss any of our Open RFC calls?Watch the recordings here! »

vue-multi-ref

2.0.1 • Public • Published

Vue Multi Ref
npm npm

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

Big thanx to @Herteby & @LinusBorg. 🔥🤘👏

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]

Install

npm i vue-multi-ref

DownloadsWeekly Downloads

77

Version

2.0.1

License

MIT

Unpacked Size

4.01 kB

Total Files

4

Last publish

Collaborators

  • avatar