问题标签 [react-native-tab-view]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
960 浏览

typescript - 如何使用 patch-package 修补 TSX 文件

问题

我正在尝试使用 patch-package 来修补 react-native package react-native-tab-view,但是当我为 react-native-tab-view 编辑 node_module 中包含的 TSX 文件并应用我的补丁时,这些更改不会反映在我的应用程序中。

node_modules/react-native-tab-view 的结构

下面是包结构的截图。 封装结构

他们还用于@react-native-community/bob在发布之前构建包,因此它会生成一个 lib 文件夹,其中包含一个模块文件夹和一个包含 JS 文件的 commonjs 文件夹。

我目前的数据

正在创建我的补丁,但是 /lib/module 中的文件不会更改,并且在模拟器上运行时更改也不会反映在我的应用程序中

在编辑 /src 中的 TSX 文件而不是模块 /lib/module 中的 JS 文件后,我尝试使用 patch-package 应用补丁,因为它实现起来要简单得多。

环境 react-native 0.63.0 补丁包 6.2.0 react-native-tab-view 2.15.1 react-native-gesture-handler 1.5.6 react-native-reanimated 1.7.0

问题 我是否缺少构建或编译步骤来获取 react-native-tab-view 以从我为其创建补丁的 TSX 文件生成新的 JS 文件?

任何帮助将不胜感激!

0 投票
0 回答
433 浏览

reactjs - 更改活动索引时如何使React Native tabview滚动回选项卡顶部

我有一个具有以下结构的屏幕:

Tabview 组件包含react-native-tabview作为滚动视图的选项卡,其中包含内容。我正在尝试像这样设置scrollView的滚动位置:

但它不起作用。嵌套的滚动视图不起作用。他们不会触发 onScroll 事件。只有父滚动视图会这样做。我想知道是否有办法解决这个问题。

据我了解,您不能嵌套垂直滚动视图,但是如何让每个选项卡成为单独的滚动视图并在更改索引时滚动到它的顶部?

以下是它的样子:

在此处输入图像描述

0 投票
3 回答
4257 浏览

react-native - 如何更改 react-native-tab-view 的颜色?

我是 react-native 和学习它的新手。在学习 react-native-tab-view 时,我尝试更改它的颜色,但经过几次尝试我无法做到。如果有人指导我如何更改默认为蓝色的标签栏颜色,我将不胜感激。这是 npm react-native-tab-view 的链接,这是一段代码。任何帮助将不胜感激。

0 投票
1 回答
191 浏览

react-native - 当在 Native-base Tabs 中调用 onChnageTab 函数时,如何将我的动态 id 传递给选项卡

我需要传递items.idOnChangeTab 我已经使用native-base索引库中的选项卡我想发送动态 id 以便我可以将相同的 id 发送到我的 api

0 投票
0 回答
226 浏览

react-native - 尝试在 react-native 中设置选项卡时出错

我需要一只手来纠正我的代码。我想用 react-native-tab-view 显示一个带有 3 个选项卡的页面,但我不知道为什么会出错。你能帮我找出卡在哪里吗?对您来说似乎很明显和容易的事情对我来说可能并不容易,所以请放纵 :) 非常感谢您的帮助和时间。

我得到:

TypeError:_this.props.onIndexChange 不是函数。(在 '_this.props.onIndexChange(index)' 中,'_this.props.onIndexChange' 未定义)

0 投票
2 回答
392 浏览

javascript - 在 TabView 内嵌套水平 FlatList(方向相同)

我在我的顶部 TabView 的一个页面内(来自react-native-tab-view)呈现水平 FlatList (来自react-native-gesture-handler )

我遇到的主要问题是 FlatList 滚动“优先级”大于 TabView 的滚动“优先级”,所以如果我想滑动顶部的 TabView,我必须将手指放在 FlatList 之外(这不是很专业)。

这是平面列表代码:

而 TabView 的代码:

有什么方法可以让用户在滚动子组件(水平 FlatList)时滑动父组件(TabView)

0 投票
3 回答
1488 浏览

javascript - React Native - 根据标签栏文本宽度更改指示器宽度(react-native-tab-view)

我正在使用react-native-tab-view,并尝试更改指示器宽度。我想和我indicator width一样the tab text。但我所做的只是默认设置。我尝试了很多方法,但总是给我错误的结果。标签栏也应该可以水平滚动。你能检查一下我应该改变哪一部分吗?

这是预期的结果: 在此处输入图像描述

ShowAllIndex 代码:

自定义标签视图代码:

谢谢你的回答!

0 投票
1 回答
315 浏览

reactjs - 如何使用 react-native-tab-view 创建动态/可更新路由?

我有以下组件。创建初始选项卡集非常有用。

但是,rarities可以更改,我想让选项卡路由创建相应地响应。
当我尝试useEffect触发setRoutes时,它会锁定应用程序。

您如何为路线动态创建一种方式?谢谢!

也发布在 GitHub 上

0 投票
0 回答
48 浏览

react-native - 从底部单击时如何使抽屉从右侧滑动

我想从右向左滑动并在底部导航中制作菜单选项卡......这是我的代码


我正在查看当前的屏幕截图 ==第一个屏幕截图 第二个屏幕截图

在当前的第二个屏幕截图中,当我按下菜单选项卡时,它没有打开抽屉屏幕,它是从顶部菜单按钮打开的......如何让它从底部菜单选项卡打开......

0 投票
2 回答
2342 浏览

react-native - 如何使用选项卡视图滚动全屏?

如何在我的配置文件页面中滚动选项卡在哪里,而选项卡内部是平面列表?

就像 Instagram 一样,如果你打开你的个人资料,就会有一个选项卡,你可以向下滚动,直到没有更多可用的图像。

我使用这个库:https ://github.com/satya164/react-native-tab-view

我尝试了很多次和不同的事情,但我没有成功。我希望有人能帮助我

€:我可以滚动,但他不显示所有结果。而且我不想在选项卡内滚动我想滚动完整的个人资料屏幕

在此处输入图像描述

ProfileTab.js

Flatlist.js