代码之家  ›  专栏  ›  技术社区  ›  Boussadjra Brahim

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

  •  3
  • Boussadjra Brahim  · 技术社区  · 7 年前

    我有一个父组件,它包含两个子组件 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>
    

    我能收到那个东西( 混入

    1 回复  |  直到 7 年前
        1
  •  3
  •   Husam Ibrahim    7 年前

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