title: How to submit a form in Vue, redirect to a new route and pass the parameters?
body: <p>I am using Nuxt and Vue and I am trying to submit a form, redirect the user to a new route including the submitted params, send an API request to get some data and then render that data.</p>
  
  <p>I achieved this by simply setting the form action to the new path and manually adding all the URL parameters to the API request.</p>
  
  <p>First I create a simple form with the route <code>/search</code>.</p>
  
  <pre><code>&lt;form action="/search"&gt;
    &lt;input type="text" name="foobar"&gt;
    &lt;button type="submit"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>When submitting the form the user leaves the current page and gets redirected to the new page. The URL would now look like this: <code>http://www.example.com/search?foobar=test</code>. Now I fetch the <code>foobar</code> parameter by using <code>this.$route.query.foobar</code> and send it to my API.</p>
  
  <p>However the problem in my approach is when submitting the form the user leaves the current page and a new page load will occur. This is not what we want when building progressive web apps.</p>
  
  <p>So my question is how can I submit a form in Nuxt/Vue and redirect to a new route including the submitted parameters?</p>