Cocos Creator 2.0 简单实现查找特定子节点(先根遍历)

发布于 2019-05-11  335 次阅读


问题

Cocos Creator 没有提供获取父节点下指定子节点的 API (getChildByName 只能获取直接子节点...)啊啊啊(突然暴躁)突然发现有cc.find方法

嘛,算了,反正都已经实现了一遍...

思路

节点树是一颗普通的树结构,树的遍历方法主要有两种:先根(先序)遍历和后根(后序)遍历。

  1. 先根遍历:若树非空,先访问根节点,再从左到右依次遍历根节点的每一棵子树
  2. 后跟遍历:若树非空,先按从左到右依次遍历根节点的每一棵子树,最后访问根节点

因此,我选择先根遍历实现,并假定树就是非空的(懒癌发作)。

贴代码

// utils.js
export default {
    /**
     * 先根遍历节点树, 查找特定子节点(第一个找到的)
     * @param {cc.Node} ele 根节点
     * @param {String} name 子节点名称
     * @returns {cc.Node | null} child
     */
    getChild(ele, name) {
        if (ele.name === name) {
            // 先访问根节点, 若找到则返回该节点
            return ele;
        }

        // 否则按从左到右的顺序遍历根节点的每一棵子树
        for (let i = 0; i < ele.children.length; i++) {
            if(this.getChild(ele.children[i], name)) {
                // 若找到则返回该节点
                return this.getChild(ele.children[i], name);
            };
        }

        // 找不到返回 null
        return null;
    }
}

然后其它 JS 中导入,比如:

import utils from "../common/utils"

utils.getChild(this.node, "turn-icon");
// cc_Node {_name: "turn-icon",...

模块的加载语法可以参考阮一峰老师的 ECMAScript 6 入门


Stay hungry, Stay foolish. 求知似饥,虚心若愚。