diff --git a/src/Container.tsx b/src/Container.tsx
index e782b903..c53ff134 100644
--- a/src/Container.tsx
+++ b/src/Container.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useCallback } from 'react'
import { StyleSheet, useWindowDimensions, View } from 'react-native'
import PagerView from 'react-native-pager-view'
import Animated, {
@@ -71,11 +71,11 @@ export const Container = React.memo(
headerContainerStyle,
cancelTranslation,
containerStyle,
- lazy,
- cancelLazyFadeIn,
pagerProps,
onIndexChange,
onTabChange,
+ lazy,
+ cancelLazyFadeIn,
width: customWidth,
allowHeaderOverscroll,
},
@@ -349,6 +349,27 @@ export const Container = React.memo(
[onTabPress]
)
+ const renderContent = useCallback(
+ (tabName: string, i: number) => {
+ if (lazy) {
+ return (
+
+ {React.Children.toArray(children)[i] as React.ReactElement}
+
+ )
+ }
+ return (
+ <>{React.Children.toArray(children)[i] as React.ReactElement}>
+ )
+ },
+ [cancelLazyFadeIn, children, lazy]
+ )
+
return (
-
- {
- React.Children.toArray(children)[
- i
- ] as React.ReactElement
- }
-
+ {renderContent(tabName, i)}
)