react-native-collapsible-tab-view: Not work syncScrollOffsets
I tried to send a Pull Request, but was failed by the process. Instead, I will send a diff of the js file. Sorry about that.
Current behavior
Not work syncScrollOffsets.
Expected behaviour
Work syncScrollOffsets.
Code sample
It seems to be a ref problem.
The scrollToxxx method is not being accessed.
diff --git a/node_modules/react-native-collapsible-tab-view/lib/module/CollapsibleTabView.js b/node_modules/react-native-collapsible-tab-view/lib/module/CollapsibleTabView.js
index f7a3837..4909fe3 100644
--- a/node_modules/react-native-collapsible-tab-view/lib/module/CollapsibleTabView.js
+++ b/node_modules/react-native-collapsible-tab-view/lib/module/CollapsibleTabView.js
@@ -88,14 +88,14 @@ const CollapsibleTabView = ({
if (newOffset !== null) {
scrollScene({
- ref: item.value,
+ ref: item.value.getNode(),
offset,
animated: false
});
listOffset.current[item.key] = offset;
} else if (itemOffset < headerHeight || !itemOffset) {
scrollScene({
- ref: item.value,
+ ref: item.value.getNode(),
offset: Math.min(offset, headerHeight),
animated: false
});
@@ -117,7 +117,7 @@ const CollapsibleTabView = ({
listRefArr.current.forEach(item => {
// scroll everything because we could be moving to a new tab
scrollScene({
- ref: item.value,
+ ref: item.value.getNode(),
offset: newOffset,
animated: true
});
@@ -169,14 +169,14 @@ const CollapsibleTabView = ({
const buildGetRef = React.useCallback(routeKey => ref => {
if (ref) {
- const found = listRefArr.current.find(e => e.key === routeKey);
-
- if (!found) {
- listRefArr.current.push({
+ listRefArr.current = listRefArr.current.filter((listRef) => {
+ return listRef.key !== routeKey
+ }).concat(
+ [{
key: routeKey,
value: ref
- });
- }
+ }]
+ );
}
}, []);
/**
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Comments: 19 (9 by maintainers)
Commits related to this issue
- feat: add createCollapsibleTabs add new API, remove react-native-tab-view. BREAKING CHANGE: remove react-native-tab-view v3 has nothing backward compatible, it's a completely new API. Fixes: #2, #... — committed to PedroBern/react-native-collapsible-tab-view by PedroBern 3 years ago
- feat: add createCollapsibleTabs add new API, remove react-native-tab-view. BREAKING CHANGE: remove react-native-tab-view v3 has nothing backward compatible, it's a completely new API. Fixes: #2, #... — committed to PedroBern/react-native-collapsible-tab-view by PedroBern 3 years ago
@matthewwen after upgrading to expo SDK 40, and updating to the recommended dependencies version for this sdk, the snack is working.
I will close this now. If somebody experiences this bug in the SDK 40, please comment here and send a repro.
Solution
Upgrade to SDK 40
Yeah I have that bug. I’ll try to develop a snack for it.
@345ml no problem. I will let it open, looks like this bug is happening to some people, but I can’t reproduce it.