Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tabbar数量变化的时候报错 #16

Open
yanhongchang-1105 opened this issue Oct 31, 2023 · 1 comment
Open

Tabbar数量变化的时候报错 #16

yanhongchang-1105 opened this issue Oct 31, 2023 · 1 comment

Comments

@yanhongchang-1105
Copy link

`const handleTabLayout = useCallback(
(index: number, layout: Layout) => {
layouts[index] = layout

  const length = layouts.filter(layout => layout.width > 0).length
  if (length !== tabs.length) {
    return
  }

  const range: number[] = []
  for (let index = 0; index < length; index++) {
    const { x, width } = layouts[index]
    // 我们希望指示器和所选 Tab 垂直居中对齐
    // 那么指示器的 x 轴偏移量就是 Tab 的 center.x - 指示器的 center.x
    const tabCenterX = x + width / 2
    const indicatorCenterX = indicatorWidth / 2
    range.push(tabCenterX - indicatorCenterX)
  }

  console.log('---------------onTabLayout-------------------')
  setOutputRange(range)
  onTabsLayout?.(layouts)
},
[onTabsLayout, tabs, layouts, indicatorWidth],`

报错 inputRange (6) and outputRange (5) must have the same length
@listenzz
Copy link
Collaborator

listenzz commented Nov 1, 2023

看能不能处理,或者使用替代方案来实现这个 tabs 控件,参考 https://github.com/ptomasroos/react-native-scrollable-tab-view 诸如此类。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants