title: VueJS - How do I use props in same component to specify the value in another component
body: <p>I am new to vuejs, I want to know how props can be g to mounted function of another component. Below i will show how i have tried it.</p>
  <p>Here is my <strong>Component.vue</strong></p>
  <pre><code>&lt;template&gt;
    &lt;div class=&quot;Passing prop value&quot;&gt;
      &lt;chart :id=&quot;'3'&quot;&gt;&lt;/chart&gt;
    &lt;/div&gt;
    &lt;div class=&quot;Passing prop value second time&quot;&gt;
      &lt;chart :id=&quot;'8'&quot;&gt;&lt;/chart&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import chart from '.chartline.vue'
  export default{
      props: {
          id: {
              type: String,
              required: true 
           }
      },
    components: {chart},
    mounted (){
      this.$http.get('api/goes/here' + this.id ) &lt;-- here id should get value 3 for 1st div and value 8 for second div
    }
  }
  &lt;/script&gt;
  </code></pre>
  <p>I am passing the id value in the component, and i expect the same value in the mounted function.</p>
  <p>As you can i tried to achieve it by using props but dont know nothing is displayed in browser, so is this the right way to use props.</p>
  <p>objective: I want to give id in the imported component and specify the value there.Please do help me.</p>