diff --git a/client/web/src/components/modals/GroupDetail/Role/tabs/member.tsx b/client/web/src/components/modals/GroupDetail/Role/tabs/member.tsx index 49741925..2102d7ca 100644 --- a/client/web/src/components/modals/GroupDetail/Role/tabs/member.tsx +++ b/client/web/src/components/modals/GroupDetail/Role/tabs/member.tsx @@ -12,6 +12,7 @@ import { t, useAsyncRequest, useGroupInfo, + useMemoizedFn, useSearch, useUserId, useUserInfoList, @@ -24,7 +25,6 @@ interface RoleMemberProps { } export const RoleMember: React.FC = React.memo((props) => { const roleId = props.currentRoleInfo._id; - const userId = useUserId(); const groupInfo = useGroupInfo(props.groupId); const members = (groupInfo?.members ?? []).filter((m) => m.roles.includes(roleId) @@ -41,11 +41,11 @@ export const RoleMember: React.FC = React.memo((props) => { filterFn: (item, searchText) => item.nickname.includes(searchText), }); - const handleAddMember = useCallback(() => { + const handleAddMember = useMemoizedFn(() => { const key = openModal( { try { await model.group.appendGroupMemberRoles( @@ -61,7 +61,7 @@ export const RoleMember: React.FC = React.memo((props) => { }} /> ); - }, [userId, props.groupId, memberIds, props.currentRoleInfo._id]); + }); const [, handleRemoveMember] = useAsyncRequest( async (memberId: string) => { @@ -84,17 +84,19 @@ export const RoleMember: React.FC = React.memo((props) => {
{/* 管理成员 */}
- } - value={searchText} - onChange={(e) => setSearchText(e.target.value)} - /> - + + {userInfoList.length > 0 && ( + } + value={searchText} + onChange={(e) => setSearchText(e.target.value)} + /> + )}
{(isSearching ? filterMembers : userInfoList).map((m) => (