Vue组件递归，开发树状菜单的问题？

Question

想做一个多级树状菜单，别的功能都实现差不多了。但子级全选父级（更上级）选中怎么实现？
还有为什么mounted里面会输出很多undifined?

数据（有省略）：
treeData: [

        {
            id: "1_1",
            name: '一级节点-1',
            open: true,
            checked: false,
            parentId: null,
            children: [
                {
                    id: "2_1",
                    name: '二级节点-1',
                    open: true,
                    checked: false,
                    parentId: "1_1",
                    children: [
                        {
                            id: "3_1",
                            name: '三级节点-1',
                            checked: false,
                            parentId: "2_1"
                        },
                        {
                            id: "3_2",
                            name: '三级节点-2',
                            open: true,
                            checked: false,
                            parentId: "2_1",
                            
                        }
                        
                    ]
                },
                {
                    id: "2_2",
                    name: '二级节点-2',
                    open: true,
                    checked: false,
                    parentId: "1_1",
                    children: [
                        {
                            id: "3_4",
                            name: '三级节点-4',
                            checked: false,
                            parentId: "2_2"
                        }
                    ]
                }
            ]
        },
        {
            id: "1_2",
            name: '一级节点-2',
            open: true,
            checked: false,
            parentId: null
        }
    ]
}

},

template:

<!--用药-诊断-->
<ul class="tree_menu">
    <li v-for="(item, index) in treelist" :key="index">
        <div class="item" v-if="item">
            <span class="toggler" v-if="item.children" @click="collapse(index)">{{toggler(index)}}</span>
            <label :id="item.id" class="clearfix" v-if="item">
                <input type="checkbox" :checked="treelist[index].checked" @click="ifChecked(index)">
                <i></i>
                <p>{{item.name}}</p>
            </label>
        </div>
        <!--组件递归(下一级)-->
        <treemenu :treelist="item.children" :parent="item" 
            v-show="treelist[index].open">
        </treemenu>
    </li>
</ul>

<script>
export default {
    name:'treemenu',
    props:["treelist","parent"], //接收父级的值
    data (){
        return{
            parentList:[]
            
        }
    },
    methods:{
        //设置折叠按钮+/-
        toggler(index){
            return !this.treelist[index].open?"+":"-";
        },
        collapse(index){
            this.treelist[index].open = !this.treelist[index].open;
        },
        /**父级->子级方法**/
        checkAll(obj){
            //如果有下一级
            if(obj.children){
                //遍历数组
                $.each(obj.children, (i,v)=>{
                    if(obj.checked){
                        v.checked = true;
                    }else{
                        v.checked = false;
                    }
                    //递归调用
                    this.checkAll(v);
                });
                
            }
        },
        /**子级->父级方法**/
        checkEach(obj){
            

        },
        //判断是否勾选(点击事件)
        ifChecked(index){
            this.treelist[index].checked = !this.treelist[index].checked; //改变自己的勾选状态
            this.checkAll(this.treelist[index]); //父级->子级方法
            this.checkEach(this.treelist[index]); //子级->父级方法
        }
        
    },
    mounted(){
        console.log(this.treelist);
    }

}

</script>

输出结果：

目前效果：

Answer 1

$emit层层放上发