title: Pass dynamic data to router-link.
body: <p>I'm trying to pass a dynamic path to vue-router but I can't seem to give it the correct syntax. Here is what I'm trying.</p>
  
  <pre><code>&lt;li v-on:click="$emit('closeDropdown')"&gt;&lt;router-link to="item.route" id="button"&gt;{{ item.title }}&lt;/router-link&gt;&lt;/li&gt;
  </code></pre>
  
  <p>Is just wrapping it in quotes not enough because this is what I see when I inspect the elements: <code>href="#/item.route"</code> for all items.</p>
  
  <h3>PARENT COMPONENT</h3>
  
  <pre><code>&lt;UserDropdownList v-for="item in userDropdownItems" v-bind:item="item"&gt;&lt;/UserDropdownList&gt;
  
   data: function () {
    return {
      userDropdownItems: [
        { title: 'Profile', route: "/profile" },
        { title: 'Users', route: "/users" }
      ]
     }
   }
  </code></pre>
  
  <p>How can I access the route property for the <code>Router-link</code> to attribute?</p>