@momo-kits/tab-view 0.151.1-beta.4 → 0.151.1-test.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.tsx +19 -10
- package/package.json +1 -1
package/index.tsx
CHANGED
|
@@ -8,8 +8,8 @@ import React, {
|
|
|
8
8
|
useRef,
|
|
9
9
|
useState,
|
|
10
10
|
} from 'react';
|
|
11
|
-
import {Animated, LayoutChangeEvent, View} from 'react-native';
|
|
12
|
-
import {Tab, TabViewProps, TabViewRef} from './types';
|
|
11
|
+
import { Animated, LayoutChangeEvent, View } from 'react-native';
|
|
12
|
+
import { Tab, TabViewProps, TabViewRef } from './types';
|
|
13
13
|
import TabBar from './tabBar/TabBar';
|
|
14
14
|
import styles from './styles';
|
|
15
15
|
import CardTabBar from './tabBar/CardTabBar';
|
|
@@ -49,9 +49,11 @@ const TabComponent: ForwardRefRenderFunction<TabViewRef, TabViewProps> = (
|
|
|
49
49
|
const pagerRef = useRef<PagerView>(null);
|
|
50
50
|
const scrollX = useRef(new Animated.Value(startPage));
|
|
51
51
|
const lazy = useRef([selectedIndex]).current;
|
|
52
|
-
const {theme} = useContext(ApplicationContext);
|
|
52
|
+
const { theme } = useContext(ApplicationContext);
|
|
53
53
|
const app = useContext<any>(MiniAppContext);
|
|
54
54
|
const screen = useContext<any>(ScreenContext);
|
|
55
|
+
let scrollEnabled = useRef(false);
|
|
56
|
+
|
|
55
57
|
const componentName = 'TabView';
|
|
56
58
|
|
|
57
59
|
const componentId = useMemo(() => {
|
|
@@ -77,7 +79,7 @@ const TabComponent: ForwardRefRenderFunction<TabViewRef, TabViewProps> = (
|
|
|
77
79
|
};
|
|
78
80
|
|
|
79
81
|
const onPageSelected = (e: PagerViewOnPageSelectedEvent) => {
|
|
80
|
-
const {position} = e.nativeEvent;
|
|
82
|
+
const { position } = e.nativeEvent;
|
|
81
83
|
if (!lazy.includes(position)) {
|
|
82
84
|
lazy.push(position);
|
|
83
85
|
}
|
|
@@ -92,7 +94,7 @@ const TabComponent: ForwardRefRenderFunction<TabViewRef, TabViewProps> = (
|
|
|
92
94
|
}
|
|
93
95
|
|
|
94
96
|
const onPageScroll = (e: PagerViewOnPageScrollEvent) => {
|
|
95
|
-
const {position, offset} = e.nativeEvent;
|
|
97
|
+
const { position, offset } = e.nativeEvent;
|
|
96
98
|
scrollX.current.setValue(position + offset);
|
|
97
99
|
pagerProps?.onPageScroll?.(e);
|
|
98
100
|
};
|
|
@@ -114,8 +116,9 @@ const TabComponent: ForwardRefRenderFunction<TabViewRef, TabViewProps> = (
|
|
|
114
116
|
return (
|
|
115
117
|
<View
|
|
116
118
|
onLayout={onLayout}
|
|
117
|
-
style={[styles.tabView, {flex: 1}]}
|
|
118
|
-
accessibilityLabel={componentId}
|
|
119
|
+
style={[styles.tabView, { flex: 1 }]}
|
|
120
|
+
accessibilityLabel={componentId}
|
|
121
|
+
>
|
|
119
122
|
<Animated.View style={style}>
|
|
120
123
|
<TabBarComponent
|
|
121
124
|
onPressTabItem={_onPressTabItem}
|
|
@@ -134,9 +137,15 @@ const TabComponent: ForwardRefRenderFunction<TabViewRef, TabViewProps> = (
|
|
|
134
137
|
{...pagerProps}
|
|
135
138
|
onPageScroll={onPageScroll}
|
|
136
139
|
ref={pagerRef}
|
|
140
|
+
scrollEnabled={scrollEnabled.current}
|
|
141
|
+
onLayout={e => {
|
|
142
|
+
pagerProps?.onLayout?.(e);
|
|
143
|
+
scrollEnabled.current = pagerProps?.scrollEnabled ?? false;
|
|
144
|
+
}}
|
|
137
145
|
onPageSelected={onPageSelected}
|
|
138
146
|
style={styles.pagerView}
|
|
139
|
-
initialPage={startPage}
|
|
147
|
+
initialPage={startPage}
|
|
148
|
+
>
|
|
140
149
|
{tabs.map((tab, index) => renderScreen(tab, index))}
|
|
141
150
|
</PagerView>
|
|
142
151
|
</View>
|
|
@@ -145,5 +154,5 @@ const TabComponent: ForwardRefRenderFunction<TabViewRef, TabViewProps> = (
|
|
|
145
154
|
|
|
146
155
|
const TabView = forwardRef(TabComponent);
|
|
147
156
|
|
|
148
|
-
export {CardTabBar, ScrollableTabBar, TabBar, TabView};
|
|
149
|
-
export type {TabViewProps, TabViewRef, Tab};
|
|
157
|
+
export { CardTabBar, ScrollableTabBar, TabBar, TabView };
|
|
158
|
+
export type { TabViewProps, TabViewRef, Tab };
|