Vue 父子组件双向绑定

#### 子组件

<template>
    <div>
        <el-form :label-position="'left'">
            <el-row :gutter="gutter">
                <el-col :span="col">
                    <el-form-item>
                        <el-input v-model="time.day" placeholder="天" :min="0" type="number" class="custom-input" @change="sum">
                            <template slot="append">天</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="col">
                    <el-form-item>
                        <el-input v-model="time.hour" placeholder="时" :min="0" type="number" class="custom-input" @change="sum">
                            <template slot="append">时</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="col">
                    <el-form-item>
                        <el-input v-model="time.minute" placeholder="分" :min="0" type="number" class="custom-input" @change="sum">
                            <template slot="append">分</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="col">
                    <el-form-item>
                        <el-input v-model="time.second" placeholder="秒" :min="0" type="number" class="custom-input" @change="sum">
                            <template slot="append">秒</template>
                        </el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
</template>

<script>
export default {
    model: {
        prop: 'time',
        event: 'time_result'
    },
    props: {
        time: {
            type: Object,
            default: { day: 0, hour: 0, minute: 0, second: 0 }
        },
        gutter: {
            type: Number,
            default: 0
        },
        col: {
            type: Number,
            default: 12
        }
    },
    created() {
        this.sum();
    },
    methods: {
        sum() {
            let { day, hour, minute, second } = this.time;

            let c_day = 60 * 60 * 24 * parseInt(day);
            let c_hour = 60 * 60 * parseInt(hour);
            let c_minute = 60 * parseInt(minute);
            let c_second = parseInt(second);

            let sum = c_day + c_hour + c_minute + c_second;

            console.log('[ sum ] >', sum);
            this.$emit('sum_result', sum);
            this.$emit('time_result', { day, hour, minute, second });
        }
    }
};
</script>

<style scoped>
/* .custom-input {
    width: 100px;
} */
.custom-input /deep/ .el-input__inner {
    padding-right: 0px;
}
</style>

#### 父组件

<jx-day-convert
    v-model="time"
    :col="5"
    :gutter="10"
    @sum_result="
        data => {
            formRecharge.add_expire_time = data;
        }
    "
></jx-day-convert>



data() {
    return {
        formRecharge:{ add_expire_time: 0}
        time: { day: 0, hour: 0, minute: 0, second: 0 }
    };
},
methods: {

}