Vue.js 访问子组件数据时出现问题

在尝试访问子组件的数据时，我一定是做错了什么

我有两组数据：目标数据和比较数据。它们可以由用户输入进行更新。计算道具更新子组件的数据，然后我想向父组件发出一个事件，这要感谢我在这两组数据上设置的观察者。然而，这些观察者似乎永远不会被触发

子组件的脚本是这样的（备注，我只粘贴了两个计算道具）：

导出默认值{
名称：“目标”，
道具：['mealPlan']，
数据（）{
返回{
目标：{
重量:0,，
卡路里：0，
碳水化合物：0，
蛋白质：0，
脂肪：0，
糖：0，
纤维：0，
胆固醇：0，
钙：0，
铁：0，
钠：0，
钾：0，
成本：0，
维生素A:0，
维生素B6:0，
维生素B12:0，
维生素C:0，
维塔明：0，
维生素：0，
维生素：0
},
比较国：{
重量:0,，
卡路里：0，
碳水化合物：0，
蛋白质：0，
脂肪：0，
糖：0，
纤维：0，
胆固醇：0，
钙：0，
铁：0，
钠：0，
钾：0，
成本：0，
维生素A:0，
维生素B6:0，
维生素B12:0，
维生素C:0，
维塔明：0，
维生素：0，
维生素：0
}
}
},
计算：{
权重目标：{
get:function（）{
this.targets.weight=this.mealPlan.targetWeight；
返回this.mealPlan.targetWeight；
},
set：函数（newValue）{
this.targets.weight=newValue
}
},
权重比较器：{
get:function（）{
this.comparators.weight=this.mealPlan.comparatorWeight；
返回此.mealPlan.comparatorWeight；
},
set：函数（newValue）{
this.comparators.weight=新值
}
},
},
观察：{
目标：职能（）{
console.log（this.targets）；
此.emit（'targetsUpdated'，此.targets）；
},
比较器：函数（）{
此.emit（'ComparatorsUpdate'，此.comparators）；
}
}
}

父组件接收如下事件：

<template>
    <div>
        <button @click="save" type="button" class="btn btn-success pull-left">Save</button>

        <div>

                <b-tab title="Targets">
                    <Targets
                    :meal-plan="mealPlan"
                    @targetsUpdated="targetsUpdated"
                    @comparatorsUpdated="comparatorsUpdated"
                    ></Targets>
                </b-tab>
        </div>
    </div>
</template>

<script>
    import MealTable from "../components/MealTable";
    import DayTable from "../components/DayTable";
    import Targets from "./Targets";
    import Specifications from "./Specifications";

    export default {
        name: "Edit",
        components: {DayTable, MealTable,Targets,Specifications},
        data(){
            return{
                mealPlan: {},
                currentDay: '1',
                targets:{},
                comparators:{},
            }
        },

        computed: {

        methods:{
            targetsUpdated(newTargets){
                this.targets = {
                    weight: newTargets.targetWeight,
                    calories: newTargets.targetCalories,
                    carbs: newTargets.targetCarbs,
                    proteins: newTargets.targetProteins,
                    fats: newTargets.targetFats,
                    sugar: newTargets.targetSugar,
                    fibers: newTargets.targetFibers,
                    cholesterol: newTargets.targetCholesterol,
                    calcium: newTargets.targetCalcium,
                    iron: newTargets.targetIron,
                    sodium: newTargets.targetSodium,
                    potassium: newTargets.targetPotassium,
                    cost: newTargets.targetCost,
                    vitaminA: newTargets.targetVitaminA,
                    vitaminB6: newTargets.targetVitaminB6,
                    vitaminB12: newTargets.targetVitaminB12,
                    vitaminC: newTargets.targetVitaminC,
                    vitaminD: newTargets.targetVitaminD,
                    vitaminE: newTargets.targetVitaminE,
                    vitaminK: newTargets.targetVitaminK
                }
            },
            comparatorsUpdated(newComparators){
                this.comparators = {
                    weight: newComparators.comparatorWeight,
                    calories: newComparators.comparatorCalories,
                    carbs: newComparators.comparatorCarbs,
                    proteins: newComparators.comparatorProteins,
                    fats: newComparators.comparatorFats,
                    sugar: newComparators.comparatorSugar,
                    fibers: newComparators.comparatorFibers,
                    cholesterol: newComparators.comparatorCholesterol,
                    calcium: newComparators.comparatorCalcium,
                    iron: newComparators.comparatorIron,
                    sodium: newComparators.comparatorSodium,
                    potassium: newComparators.comparatorPotassium,
                    cost: newComparators.comparatorCost,
                    vitaminA: newComparators.comparatorVitaminA,
                    vitaminB6: newComparators.comparatorVitaminB6,
                    vitaminB12: newComparators.comparatorVitaminB12,
                    vitaminC: newComparators.comparatorVitaminC,
                    vitaminD: newComparators.comparatorVitaminD,
                    vitaminE: newComparators.comparatorVitaminE,
                    vitaminK: newComparators.comparatorVitaminK
                }
            }
        }
    }
</script>

拯救
从“./组件/可测量设备”导入可测量设备；
从“./组件/日表”导入日表；
从“/Targets”导入目标；
从“/Specifications”导入规范；
导出默认值{
名称：“编辑”，
组件：{DayTable，MealTable，Targets，specification}，
数据（）{
返回{
梅尔普兰：{}，
当前日期：“1”，
目标：{}，
比较国：{}，
}
},
计算：{
方法：{
目标支持（新目标）{
这一点。目标={
重量：新目标。目标重量，
卡路里：新目标。目标卡路里，
碳水化合物：新目标。目标碳水化合物，
蛋白质类：新目标。目标蛋白质类，
脂肪：新目标。目标脂肪，
sugar:newTargets.targetSugar，
光纤：新目标。目标光纤，
胆固醇：新目标。目标胆固醇，
钙：新目标。目标钙，
铁：新目标。目标铁，
钠：新目标。目标钠，
钾：新目标。目标钾，
成本：newTargets.targetCost，
vitaminA:newTargets.targetVitaminA，
维生素B6:newTargets.targetVitaminB6，
维生素B12:newTargets.targetVitaminB12，
维生素C:newTargets.targetVitaminC，
vitaminD:newTargets.targetVitaminD，
维生素：新目标。目标维生素，
维生素k:newTargets.targetVitaminK
}
},
比较国更新（新成员）{
这是一个比较器={
重量：新参数。比较器重量，
卡路里：新的parators.comparatorCalories，
碳水化合物：新的parator，comparatorCarbs，
蛋白质类：新的辅助物、比较蛋白、，
脂肪：新的辅助脂肪，
糖：新的parators.comparatorSugar，
纤维：新的分离纤维、比较纤维、，
胆固醇：新的辅助成分。比较胆固醇，
钙：新的辅助物。比较钙，
铁：新的对撞机，比较仪，
钠：新的对苯二甲酸钠，
钾：新的对映体。对映体钾，
成本：新员工。比较成本，
vitaminA：新来的parators.comparatorVitaminA，
维生素B6:newComparators.com
<template>
    <div>
        <button @click="save" type="button" class="btn btn-success pull-left">Save</button>

        <div>

                <b-tab title="Targets">
                    <Targets
                    :meal-plan="mealPlan"
                    @targetsUpdated="targetsUpdated"
                    @comparatorsUpdated="comparatorsUpdated"
                    ></Targets>
                </b-tab>
        </div>
    </div>
</template>

<script>
    import MealTable from "../components/MealTable";
    import DayTable from "../components/DayTable";
    import Targets from "./Targets";
    import Specifications from "./Specifications";

    export default {
        name: "Edit",
        components: {DayTable, MealTable,Targets,Specifications},
        data(){
            return{
                mealPlan: {},
                currentDay: '1',
                targets:{},
                comparators:{},
            }
        },

        computed: {

        methods:{
            targetsUpdated(newTargets){
                this.targets = {
                    weight: newTargets.targetWeight,
                    calories: newTargets.targetCalories,
                    carbs: newTargets.targetCarbs,
                    proteins: newTargets.targetProteins,
                    fats: newTargets.targetFats,
                    sugar: newTargets.targetSugar,
                    fibers: newTargets.targetFibers,
                    cholesterol: newTargets.targetCholesterol,
                    calcium: newTargets.targetCalcium,
                    iron: newTargets.targetIron,
                    sodium: newTargets.targetSodium,
                    potassium: newTargets.targetPotassium,
                    cost: newTargets.targetCost,
                    vitaminA: newTargets.targetVitaminA,
                    vitaminB6: newTargets.targetVitaminB6,
                    vitaminB12: newTargets.targetVitaminB12,
                    vitaminC: newTargets.targetVitaminC,
                    vitaminD: newTargets.targetVitaminD,
                    vitaminE: newTargets.targetVitaminE,
                    vitaminK: newTargets.targetVitaminK
                }
            },
            comparatorsUpdated(newComparators){
                this.comparators = {
                    weight: newComparators.comparatorWeight,
                    calories: newComparators.comparatorCalories,
                    carbs: newComparators.comparatorCarbs,
                    proteins: newComparators.comparatorProteins,
                    fats: newComparators.comparatorFats,
                    sugar: newComparators.comparatorSugar,
                    fibers: newComparators.comparatorFibers,
                    cholesterol: newComparators.comparatorCholesterol,
                    calcium: newComparators.comparatorCalcium,
                    iron: newComparators.comparatorIron,
                    sodium: newComparators.comparatorSodium,
                    potassium: newComparators.comparatorPotassium,
                    cost: newComparators.comparatorCost,
                    vitaminA: newComparators.comparatorVitaminA,
                    vitaminB6: newComparators.comparatorVitaminB6,
                    vitaminB12: newComparators.comparatorVitaminB12,
                    vitaminC: newComparators.comparatorVitaminC,
                    vitaminD: newComparators.comparatorVitaminD,
                    vitaminE: newComparators.comparatorVitaminE,
                    vitaminK: newComparators.comparatorVitaminK
                }
            }
        }
    }
</script>

watch: {
    targets: {
      // This will let Vue know to look inside the object
      deep: true,

      // We have to move our method to a handler field
      handler()
        this.$emit('targetsUpdated', this.targets);
      }
    },
    comparators: {
      // This will let Vue know to look inside the object
      deep: true,

      // We have to move our method to a handler field
      handler()
        this.$emit('comparatorsUpdated', this.comparators);
      }
    }
 }

       weightComparator:{
            get:function(){
                this.comparators.weight = this.mealPlan.comparatorWeight;
                return this.mealPlan.comparatorWeight;
            },
            set:function(newValue){
                let oldValue = this.comparators.weight
                this.$emit('change:comparators:weight', newValue, oldValue)
                let oldComparators = Object.assign({}, this.comparators) // shallow copy
                this.comparators.weight = newValue
                this.$emit('changed:comparators', Object.assign({}, this.comparators), oldComparators)                                          

            }
        },