title: NUXT pass object data into pages with path
body: <p>I'm really new to Vue and Nuxt so I apologise if this is a simple question.</p>
  <p>I'm generating my routes dynamically on making an API call for my data on Index.vue. One API call is enough for me to retrieve all the data i need which is stored in <code>deals_array</code>, so I don't need another API call on my individual page, I just need the data from each <code>deal</code> in <code>deals_array</code>.</p>
  <pre class="lang-html prettyprint-override"><code>&lt;ul&gt;
    &lt;li v-for=&quot;deal of deals_array&quot; :key=&quot;deal.id&quot;&gt;
      &lt;nuxt-link :to=&quot;getSlug(deal)&quot;&gt;{{ deal.name }}, {{deal.value}}&lt;/nuxt-link&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  <p>I'm wondering how do I pass the entire <code>deal</code> object into my pages, so that when I click on the individual <code>nuxt-link</code> I would be able to access that deal object and all its attributes (for each page).</p>
  <p>I've taken a look at passing <code>params</code> into nuxt-link but I understand that it only pairs with <code>name</code> attribute and not the <code>path</code>, where I need the <code>path</code> URL in this case.</p>
  <p>I may be doing this entirely wrong so I'm hoping to be pointed in the right direction.</p>
  <p>Edit - getSlug function</p>
  <pre class="lang-js prettyprint-override"><code>getSlug(deal) {
        let name = deal.name;
        let dealDetails = deal.details;
        let name_hyphen = name.replace(/\s+/g, &quot;-&quot;);
        let deal_hyphen = dealDetails.replace(/\s+/g, &quot;-&quot;);
        let nameDealSlug = name_hyphen + &quot;-&quot; + deal_hyphen;
        // remove selected special characters from slug
        let clean_nameDealSlug = nameDealSlug.replace(
          /[&amp;\/\\#,+()$~%.'&quot;:*?&lt;&gt;{}]/g,
          &quot;&quot;
        );
  
        let finalSlug = `deals/${clean_nameDealSlug}`;
        return finalSlug;
      }
  </code></pre>