如何使用Vue.js将混音作为道具传递并在子组件中使用它们

我有一个父组件，它包含两个子组件，分别称为

add

和

edit

，这些组件有一些公共属性，我想使用

mixins

，为此我将一个名为

mix

的对象添加到父对象的数据对象中，并将其作为

props

传递给子组件，如下所示

父组件：

  <template>
      <div id="app">
       <add :mixin="mix" operation="add"></add>
        ...
        <edit :mixin="mix"  operation="edit"></edit>
     </div>
  </template>  

  <script>
   export default {
        name: "App",
       data(){
          return{
          /****/
            mix:{
              data() {
                  return {
                     user: { name: "", email: "" },
                     users: []
                };
              },
              methods: {
                add() {
                   this.users.push(this.user);
                     },

                    }
                  }
                }
           /*****/
               };
              },
     components: {
         add,edit
    }
     };
   </script>

...
导出默认值{
名称：“应用程序”，
数据（）{
返回{
/****/
混合：{
数据（）{
返回{
用户：{name:，电子邮件：}，
用户：[]
};
},
方法：{
添加（）{
this.users.push（this.user）；
},
}
}
}
/*****/
};
},
组成部分：{
添加、编辑
}
};

---

我可以在我的子组件中接收该对象（

mix

），但如何将其分配给

mixins

属性？

解决此问题的一种简单方法是重构代码并将mixin写入单独的文件中。然后，您可以在两个组件中导入mixin对象，并将其分配给mixin属性。

如果在Vue中可以这样做，我会感到惊讶。你为什么要这样做？@HusamIbrahim我的组件有一些共同的属性，我需要创建mixin来重用代码。我的意思是，你为什么不创建mixin并在两个组件中静态使用它，而不是将它作为道具传递？您是否需要在运行时动态地修改组件定义？您所说的“静态”是什么意思？我不想两次编写代码—如果这是唯一的目标—然后重构代码。将mixin写入另一个文件，并将其导入两个组件，并将其分配给mixin属性。