title: How to trigger click on ref in Vue.js
body: <p>I have a list</p>
  
  <pre><code>&lt;li v-for="menu_item, key in menu" @click="clickMenu(key)" :ref="'menu'+key"&gt;
    {{menu_item.name}}
  &lt;/li&gt;
  </code></pre>
  
  <p>And in my vue I have</p>
  
  <pre><code>mounted(){
     // This shows the $refs as being mounted and available
     console.log(this.$refs)
     console.log(this.$refs.menu1)
     // Click menu item 2 seconds after mounting
     this.$refs.menu1.click()
     // click is UNDEFINED
  
  },
  methods: {
     clickMenu:function(key){
        console.log("CLICKED "+key)
     },
  }
  </code></pre>
  
  <p>I get "Cannot read property 'click' of undefined"</p>
  
  <p>How do I simply just trigger a click on the element programmatically?</p>
  
  <p>Another answer on Github says I should do ...</p>
  
  <pre><code> this.$refs.menu1.$el.click()
  </code></pre>
  
  <p>But that isn't defined either ??</p>
  
  <p>Heres a JSFiddle
  Hopefully someone can figure it out
  <a href="https://jsfiddle.net/holoverse/Lr2eptaw/3/" rel="noreferrer">JSFIDDLE HERE!!</a></p>