| | |
| | | handleSearch('', arr); |
| | | }, [data]); |
| | | |
| | | |
| | | const getParentKey = (key, tree) => { |
| | | let parentKey; |
| | | for (let i = 0; i < tree.length; i++) { |
| | |
| | | }; |
| | | |
| | | function handleSearch(value, dataList) { |
| | | |
| | | console.log('value, dataList', value, dataList); |
| | | const newExpandedKeys = dataList |
| | | .map((item) => { |
| | |
| | | } |
| | | |
| | | const treeData = useMemo(() => { |
| | | const loop = (data) => |
| | | data.map((item) => { |
| | | const loop = (data) => { |
| | | const copiedData = JSON.parse(JSON.stringify(data)); |
| | | return copiedData.map((item, idx) => { |
| | | const strTitle = item.label; |
| | | const index = strTitle.indexOf(searchValue); |
| | | |
| | | // 只保留包含 searchValue 的项 |
| | | if (index <= -1 && !item.children) { |
| | | return null; // 返回 null 表示不包含在最终结果中 |
| | | } |
| | | |
| | | const beforeStr = strTitle.substring(0, index); |
| | | const afterStr = strTitle.slice(index + searchValue.length); |
| | | const label = |
| | |
| | | ) : ( |
| | | <span>{strTitle}</span> |
| | | ); |
| | | |
| | | if (item.children) { |
| | | const filteredChildren = loop(item.children).filter(Boolean); // 递归处理子项并过滤掉 null |
| | | return { |
| | | label, |
| | | name: strTitle, |
| | | value: item.value, |
| | | checkable: item.checkable, |
| | | children: loop(item.children), |
| | | children: filteredChildren.length > 0 ? filteredChildren : undefined, |
| | | }; |
| | | } |
| | | |
| | | return { |
| | | label, |
| | | name: strTitle, |
| | | checkable: item.checkable, |
| | | value: item.value, |
| | | }; |
| | | }); |
| | | // data = data.filter(i => i.label?.indexOf(searchValue) > -1); |
| | | // console.log('data.filter',data.filter(i => i.label?.indexOf(searchValue) > -1)); |
| | | console.log('loop(data)', loop(data)); |
| | | }).filter(Boolean); // 过滤掉 null |
| | | }; |
| | | |
| | | return loop(data); |
| | | |
| | | }, [searchValue, data]); |
| | | |
| | | |
| | | useEffect(() => { |
| | | if (!visible) return; |
| | |
| | | <div className="selectObjModal-main"> |
| | | <div className="selectObjModal-left"> |
| | | <div className="selectObjModal-left-search"> |
| | | <Search placeholder={`查询${nameStr}名称`} onChange={(e) => handleSearch(e.target.value, dataList)} /> |
| | | <Search |
| | | placeholder={`查询${nameStr}名称`} |
| | | onSearch={(e) => { |
| | | // handleSearch('', dataList) |
| | | if (!e) { |
| | | handleSearch('', dataList); |
| | | } else { |
| | | handleSearch(e, dataList); |
| | | } |
| | | }} |
| | | /> |
| | | </div> |
| | | <div className="selectObjModal-left-main"> |
| | | {data.length > 0 ? ( |