Skip to content

Commit

Permalink
Merge pull request #851 from thundersdata-frontend/rn-issue
Browse files Browse the repository at this point in the history
fix: 修复Tabs在涉及到state变动时导致re-render的bug
  • Loading branch information
chj-damon authored Apr 17, 2024
2 parents b6c886c + b1257f7 commit 1e0c873
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 7 deletions.
5 changes: 5 additions & 0 deletions .changeset/small-years-stare.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@td-design/react-native-tabs': patch
---

fix: 修复Tabs在涉及到state变动时导致re-render的bug
10 changes: 3 additions & 7 deletions packages/react-native-tabs/src/index.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { ComponentType, createElement, memo } from 'react';
import React, { ReactNode } from 'react';
import { Animated, StyleProp, TextStyle, ViewStyle } from 'react-native';
import PagerView from 'react-native-pager-view';

Expand All @@ -14,7 +14,7 @@ const AnimatedPagerView = Animated.createAnimatedComponent<typeof PagerView>(Pag

type Tab = {
title: string;
component: ComponentType<any>;
component: ReactNode;
};

export interface TabsProps {
Expand Down Expand Up @@ -113,15 +113,11 @@ export default function Tabs({
{({ loading }) => {
if (loading) return renderLazyPlaceholder?.();

return <SceneComponent {...{ component }} />;
return component;
}}
</SceneView>
))}
</AnimatedPagerView>
</Box>
);
}

const SceneComponent = memo(<T extends { component: ComponentType<any> }>({ component }: T) => {
return createElement(component);
});

0 comments on commit 1e0c873

Please sign in to comment.