如何在 TreeView 收起时隐藏加载图标（Loading Icon）

branch.on('click', function (e) {   if (this === e.target) {     const icon = $(this).children('i:first');     const $childrenUl = $(this).children('ul'); // 更精准的目标元素      // 切换状态：true → 展开；false → 收起     flag = !flag;      // 更新图标类     icon.toggleclass(openedClass + ' ' + closedClass);      if (flag) {       // 【展开时】：插入 loading，延时移除并展开内容       $(this).append('
');       setTimeout(() => {         $(this).find('.loading').remove();         $childrenUl.slideDown(400); // 推荐用 slideDown/slideUp 替代 slideToggle，语义更清晰       }, 400);     } else {       // 【收起时】：直接收起，不插入、不显示 loading       $childrenUl.slideUp(400);     }   } });

? 注意细节优化：使用 $(this).children(‘ul’) 明确目标子菜单，避免 children().children() 这种模糊选择器可能引发的意外行为；slideDown() / slideUp() 比 slideToggle() 更可控，配合 flag 可完全解耦展开/收起逻辑；HTML 中 标签需闭合（原文缺失 >，已修正）：。

? 常见错误规避

• ❌ 错误：将 let flag = false 写在 $.fn.treed 函数顶部 → 所有分支共用一个 flag，状态同步失效；
• ❌ 错误：未清理 .loading 元素即再次点击 → 多个 loading 叠加或残留；
• ❌ 错误：在 else 分支中遗漏 slideUp() → 收起无动画，体验割裂。

✅ 完整推荐写法（精简整合版）

$.fn.extend({   treed: function (options) {     const opts = $.extend({       openedClass: 'fa-minus-circle',       closedClass: 'fa-plus-circle'     }, options);      return this.each(function () {       const $tree = $(this).addClass('tree');       $tree.find('li').has('ul').each(function () {         const $branch = $(this);         const $icon = $('', {           class: `indicator fas ${opts.closedClass}`         }).prependTo($branch);         $branch.addClass('branch');          let isOpen = false; // ✅ 每个分支独立状态          $branch.on('click', function (e) {           if (e.target !== this) return;            isOpen = !isOpen;           $icon.toggleClass(`${opts.openedClass} ${opts.closedClass}`);            const $ul = $branch.children('ul');           if (isOpen) {             $branch.append('
');             setTimeout(() => {               $branch.find('.loading').remove();               $ul.slideDown(400);             }, 400);           } else {             $ul.slideUp(400);           }         });          // 初始化：默认收起子菜单         $branch.children('ul').hide();       });        // 图标/链接/按钮点击透传       $tree.find('.branch .indicator, .branch>a, .branch>button')         .on('click', function (e) {           $(this).closest('li').click();           e.preventDefault();         });     });   } });