vue-propsync-mixin v1.0.1

vue-propsync-mixin

vue-propsync-mixin：vue组件的混合对象，主要用于组件编写时混入调用。

【主要功能】

1. 实现了在组件内自动创建所有prop对应的data属性，方便组件内修改prop使用。解决了vue2.0中数据单向流的问题
2. 实现了子组件修改组件prop，组件内自动同步修改到父组件的data属性。

【使用方法】

1. 编写组件：在选项对象中增加 mixins:propsync即可，无需其他修改
2. 调用组件：在调用的组件上新增 .sync 属性

【可配置忽略】

1. 默认情况下，调用了本mixin的组件，会实现组件定义的所有的props，创建对应data变量，绑定双向watch。
2. 若希望某个props进行绑定，则可在那个props中增加 propsync:true(可配置)，默认所有props均为false

调用组件例：

<!-- 父组件 -->
<template>
    <my-component :show.sync="show" />
</template>
<script>
    export default {
        data(){
            return {
                show:false
            }
        }
    }
</script>

<!-- 子组件 -->
<template>
    <div>
        <div v-show="sync_show">vue-propsync-mixin</div>
         <button @click="onClick">按钮</button>
    </div>
</template>
<script>
    import propsyncMixin from 'vue-propsync-mixin'
    export default {
        name:'MyComponent',
        mixins: [propsyncMixin],
        props: {
            show: {
                type: Boolean,
                default: false,
                propsync: true
            }
        },
        methods:{
            onClick(){
                this.sync_show = !this.sync_show
            }   
        }
    }
</script>