title: Copy url to clipboard via button click in a vuejs component
body: <p>I have following component, and I would like to have a button that copies the <code>link_url</code> to the clipboard on click.</p>
  <p>I have javascript code that works when selecting an id, however the links do not have an id.
  Can I accomplish the selection of the <code>a-tag</code> via refs in the component itself, or what would be the best way to get this done.</p>
  <p>I was also thinking about generating an a-tag with the this.link_url in the <code>copyURL()</code> dynamically but I guess that would be very dirty.. I am looking for the vuejs way.</p>
  <pre><code>&lt;template&gt;
    &lt;li class=&quot;list-group-item&quot;&gt;
      &lt;a :href=&quot;link_url&quot; 
           class=&quot;text-dark&quot; 
           target=&quot;_blank&quot; 
           rel=&quot;noopener noreferrer&quot;&gt;{{ link_name }}&lt;/a&gt;
      &lt;button @click=&quot;copyUrl&quot;&gt;copy url from a tag&lt;/button&gt;
    &lt;/li&gt;      
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    props: [&quot;link_url&quot;, &quot;link_name&quot;],
    methods: {
      copyURL() {
        var Url = document.getElementById('myid'); /*GET vuejs el reference here (via $ref) but how?*/
        Url.innerHTML = window.location.href;
        console.log(Url.innerHTML)
        Url.select();
        document.execCommand(&quot;copy&quot;);
      }
    }
  }
  &lt;/script&gt;
  
  &lt;style&gt;
  &lt;/style&gt;
  </code></pre>