title: How to pass mixins as props and use them in child components using Vue.js
body: <p>I have a parent component which contains two child components called <code>add</code> and <code>edit</code>, these components have some common properties and i want to use <code>mixins</code>, for that i add an object called <code>mix</code> to the parent's data object and i pass it as <code>props</code> to child components as follow</p>
  
  <p>the parent component :</p>
  
  <pre><code>  &lt;template&gt;
        &lt;div id="app"&gt;
         &lt;add :mixin="mix" operation="add"&gt;&lt;/add&gt;
          ...
          &lt;edit :mixin="mix"  operation="edit"&gt;&lt;/edit&gt;
       &lt;/div&gt;
    &lt;/template&gt;  
  
    &lt;script&gt;
     export default {
          name: "App",
         data(){
            return{
            /****/
              mix:{
                data() {
                    return {
                       user: { name: "", email: "" },
                       users: []
                  };
                },
                methods: {
                  add() {
                     this.users.push(this.user);
                       },
  
                      }
                    }
                  }
             /*****/
                 };
                },
       components: {
           add,edit
      }
       };
     &lt;/script&gt;
  </code></pre>
  
  <p>I could receive that object (<code>mix</code>) in my child component, but how could i assign it to the <code>mixins</code> property?</p>