title: Vue.js - Using parent data in component
body: <p>How I can get access to parent's data variable (limitByNumber) in my child component Post?</p>
  <p>I tried to use prop but it doesn't work.</p>
  <p><strong>Parent:</strong></p>
  <pre><code>import Post from './components/Post.vue';
  
  new Vue ({
      el: 'body',
  
      components: { Post },
  
      data: {
          limitByNumber: 4
      }
  });
  </code></pre>
  <p><strong>Component Post:</strong></p>
  <pre><code>&lt;template&gt;
      &lt;div class=&quot;Post&quot; v-for=&quot;post in list | limitBy limitByNumber&quot;&gt;
      &lt;!-- Blog Post --&gt;
      ....
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;!-- script --&gt;    
  &lt;script&gt;
  export default {
      props: ['list', 'limitByNumber'],
      
      created() {
          this.list = JSON.parse(this.list);
      }
  }
  &lt;/script&gt;
  </code></pre>