G6使用image类型的节点，展开收起有BUG

[wyssyw]

连续多次展开收起，控制台固定报错：

报错文本：
Uncaught TypeError: Cannot read properties of undefined (reading 'src')
at ImagePool.getImageSync (mf-dep____vendor.c7c6bde6.js:111758:97)
at ImageRenderer.render (mf-dep____vendor.c7c6bde6.js:110424:39)
at CanvasRendererPlugin.renderDisplayObject (mf-dep____vendor.c7c6bde6.js:109657:23)
at renderByZIndex (mf-dep____vendor.c7c6bde6.js:109374:21)
at mf-dep____vendor.c7c6bde6.js:109416:13
at mf-dep____vendor.c7c6bde6.js:98527:18
at Array.forEach ()
at SyncHook.call (mf-dep____vendor.c7c6bde6.js:98525:22)
at RenderingService.render (mf-dep____vendor.c7c6bde6.js:101195:29)
at Canvas.render (mf-dep____vendor.c7c6bde6.js:107123:24)
at tick (mf-dep____vendor.c7c6bde6.js:107135:16)

[wyssyw]

        node: {
            type: 'image',
            // type: 'circle',
            style: {
                src: (model) => {
                    const depth = model?.depth || 0;
                    if (model?.isDirectory === false) {
                        return pointIcon;
                    }

                    const depthImgMap = {
                        0: subjectIcon,
                        1: level1Icon,
                        2: level2Icon,
                        3: level3Icon,
                        4: level4Icon,
                        5: pointIcon,
                    };
                    return depthImgMap[depth];
                },
            fill: (model) => {
                // 根据节点深度设置不同的背景色
                const depth = model?.depth || 0;
                if (model?.isDirectory === false) {
                return '#DF951F'; // 考点背景色
                }
                
                const colorMap = {
                0: '#6554EA', // 根节点 - 紫色
                1: '#4873F1', // 第一层 - 蓝色
                2: '#1FA5F2', // 第二层 - 浅蓝色
                3: '#10CDBF', // 第三层 - 青色
                4: '#72C05F', // 第四层 - 绿色
                };
                return colorMap[depth] || '#DF951F'; // 默认为考点颜色
            }, // 节点背景色
            labelText: (d) => d.directoryName, // 节点文案从directoryName字段取值
            labelPlacement: (model) => {
                // 根节点文案放在中间，其他节点放在下面
                return model?.depth === 0 ? 'center' : 'bottom';
            }, // 节点文案位置：'left'|'right'|'top'|'bottom'|'center'|'left-top'|'left-bottom'|'right-top'|'right-bottom'|'top-left'|'top-right'|'bottom-left'|'bottom-right'|[number,number]
            labelFill: (model) => {
                // 根节点使用黑色，其他节点使用灰色
                return model?.depth === 0 ? '#FFFFFF' : '#B2B2B2';
            }, // 节点文案颜色
            labelFontSize: (model) => {
                // 根节点使用16px，其他节点使用10px
                return model?.depth === 0 ? 18 : 10;
            }, // 节点文案字体大小
            labelLineHeight: 1.5, // 节点文案行高
            labelFontWeight: 'bold', // 节点文案字体粗细
            labelFontFamily: 'SourceHanSansCN, SourceHanSansCN', // 节点文案字体
            labelWordWrap: true, // 节点文案是否自动换行
            labelMaxWidth: 100, // 节点文案最大宽度

            labelBackground: false, // 节点文案是否显示背景
            labelBackgroundFill: 'blue', // 节点文案背景颜色
            labelPadding: [4, 8], // 节点文案内边距

            size: (model) => {
                const depth = model.depth || 0;
                switch(depth) {
                case 0: // 根节点
                    return 80;
                case 1: // 第一层
                    return 60;
                case 2: // 第二层
                    return 40;
                default: // 其他层级，包括考点
                    return 40;
                }
            },
            halo: true, // 节点光环效果，如果节点是图片，就是图片边框
            haloStrokeOpacity: 0.25, // 节点光环边框透明度
            },
            // 自定义节点状态样式
            state: {
            // 选中状态样式
            selected: { // 配合graph.setElementState(target.id, 'selected');使用
                fill: 'yellow', // 选中时的填充色
                stroke: 'blue', // 选中时的边框色
                lineWidth: 2, // 选中时的边框宽度
                shadowColor: '#ff4d4f', // 选中时的阴影颜色
                shadowBlur: 10, // 选中时的阴影模糊度
            },
            // 悬停状态样式
            hover: {},
            // 高亮状态样式
            highlight: {}
            },
            // 自定义节点动画
            animation: {
                enable: true,
                enter: 'fade',
                exit: 'fade'
            }
        },
        
        
        behaviors: (existingBehaviors) => {
            return [
            ...existingBehaviors, 
            //   'collapse-expand', // 展开收起，使用图片节点会有问题，组件未兼容
            {
                type: 'collapse-expand',
                align: true, // 确保展开/收起时节点位置正确
                trigger: 'click', // 点击触发展开收起
                onExpand: (id) => {
                    console.log('onExpand', id);
                    async () => {
                        try {
                            console.log('开始布局');
                            // 节点展开完成后触发布局
                            await graphRef.current.layout({ 
                                ...layoutConfig,
                                // animation: {
                                //     duration: 300,
                                //     easing: 'ease-out' // 使用更自然的缓动函数
                                // }
                            });
                        } catch (error) {
                            console.error('布局失败:', error);
                        } finally {
                            // stopRender();
                            console.log('布局完成');
                        }
                    }
                },
                onCollapse: (node) => {
                    console.log('onCollapse', node);
                }
            },