vue + element之Tree父级节点与子级节点不关联、子节点与父节点关联

最近做后台管理系统做权限管理，用的是tree树形结构，当然文档提供了关联关系 但是不是我想要的
需求是这样的：
当选中父节点时下面所有子节点选中；当选中子节点时，它的父节点选中；
当取消子节点选中时，它的父级不变

下面展示一些 内联代码片。

// template
<el-tree
      ref="tree"
      default-expand-all
      :data="optionData"
      show-checkbox
      check-strictly
      node-key="id"
      @check="getCurrentNode"
      :default-checked-keys="ruleForm.menuIds"
      :props="defaultProps">
</el-tree>

// js
methods：{
	getCurrentNode(data) {
       // console.log(data)
        let node = this.$refs.tree.getNode(data);
        this.childNodes(node);
        this.parentNodes(node);
        //是否编辑的表示
        this.ruleForm.isEditorFlag = true;
        //编辑时候使用
        this.ruleForm.menuIds = this.$refs.tree.getCheckedKeys();
        //无论编辑和新增点击了就传到后台这个值
        this.ruleForm.menuIdsisEditor = this.$refs.tree.getCheckedKeys().concat(this.$refs.tree.getHalfCheckedKeys());
     },
     //具体方法可以看element官网api
     childNodes(node){
         let len = node.childNodes.length;
          for(let i = 0; i < len; i++){
              node.childNodes[i].checked = node.checked;
              this.childNodes(node.childNodes[i]);
          }
      },
      parentNodes(node){
          if(node.parent){
              for(let key in node){
                  if(key == "parent"){
                      node[key].checked = true;
                      this.parentNodes(node[key]);
                  }
              }
          }
      },
}
//希望对童鞋们有所帮助