title: How to pass parameters from one component to another in router.push() (Vue.js)?
body: <p>I am implementing a function where a user clicks on the edit button(present inside a row) all the details from that row should get passed to form component where I should get default values of these fields from the parameters. I'm not sure how to implement this... Can anyone suggest a solution?</p>
  
  <pre><code>----------inside table component------------------
  
  edit_row(id){
        // alert("deleting row " + id);
        var d_fname = this.users[id].fname;
        var d_lname = this.users[id].lname;
        var d_tech = this.users[id].tech;
        this.$router.push({name:  'form/', params: {d_fname, d_lname, d_tech}});
        // this.$router.push({name:'/form1',  params:{d_fname,  d_lname,  d_tech}});
      }
  
  
  ----------------inside form component------------------------
  
  &lt;template&gt;
    &lt;form id="form"&gt;
      &lt;h4&gt;Personal Information&lt;/h4&gt;
      &lt;br /&gt;
      &lt;input type="text" placeholder="First Name" v-model="fname" /&gt;
      &lt;p&gt;{{user_info}}&lt;/p&gt;
      &lt;br /&gt;
      &lt;input type="text" placeholder="Last Name" v-model="lname" /&gt;
      &lt;br /&gt;
      &lt;input type="text" placeholder="Technologies" v-model="tech" /&gt;
      &lt;br /&gt;
      &lt;button type="button" value="submit" @click="submit_info()"&gt;Submit&lt;/button&gt;
    &lt;/form&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    name: "form1",
    props:["d_fname", "d_lname", "d_tech"],
    data() {
      return {
          fname: "",
          lname: "",
          tech: ""
      };
    }
  }
  </code></pre>