问题标签 [react-native-collapsible]

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 投票
2 回答
271 浏览

react-native - 如何一次只展开一个可折叠的

我对本机反应很陌生。所以现在这里的问题是我想一次只展开和折叠一个项目。目前,即使我只点击一个项目,每个项目都会同时展开和折叠有什么建议吗?下面是我的代码,我附上了我的屏幕截图。

在此处输入图像描述

0 投票
2 回答
91 浏览

react-native - 动态填充嵌套的 react-native-collapsible

我需要使用来自 api 请求的项目填充菜单。我做了一些样品;const items. 有些菜单项有子项,子项也可以有子项,所以我需要嵌套几级菜单项。

我用Accordion()react-native-collapsible 制作了一个 with Collapsible 和一个AccordionItem()for 没有子项的项目。

function App()呈现菜单项两次。一次通过手动添加Accordions 和AccordionItems 一次通过映射items[]RootMenuItem()为每个顶级项目调用并通过递归呈现该项目及其子项目。

当手动添加每个项目时,它会按照我想要的方式工作。我需要以编程方式填充菜单,但渲染的嵌套手风琴RootMenuItem()在 android 和 iOS 上表现不佳。在snack.io 上的网络测试时,它似乎工作正常。

这是我完整的 App.js 的小吃: https ://snack.expo.dev/@dissar/nested-collapsibles

难道我做错了什么?有没有人有任何提示可以更好地做到这一点?

PS:在snack.io 上测试时,动态渲染的项目有奇怪的宽度,但不要担心。

0 投票
1 回答
65 浏览

react-native - 为什么当我选择一个项目时 FlatList 会滚动到顶部

我有一个FlatList物品TouchableOpacity。当我尝试选择一个项目时,列表滚动到顶部。

这是Collapsible内容;

在此处输入图像描述

0 投票
1 回答
48 浏览

javascript - 如何从同一平面列表中的另一个项目更改平面列表中的项目的状态?

我正在制作具有可折叠回复的嵌套评论。为此,我只需按照收到它们的顺序将所有评论呈现在平面列表中,然后根据每个项目的级别属性在左侧添加一个边距。传入的评论数据如下。

然后我使用以下平面列表呈现这些评论

最后,我将实际的评论组件包装在一个 Collapsible(react-native-collapsible 包)中。这样我可以通过点击它来折叠特定的评论。'collapsed' 属性是使用 isCollapsed 状态设置的。

使用上面的代码,我可以通过点击来折叠每个单独的评论。

问题是我不想折叠我正在按下的评论。我想折叠它的孩子,为此我真的很想知道如何在不影响父评论的情况下为父评论的孩子操纵 isCollapsed 状态。由于每条评论都有一个唯一的 id,我相信也许可以使用它来完成?每个评论的孩子也是一个属性,所以也许这也有帮助。

任何线索都会非常有帮助。谢谢

0 投票
0 回答
30 浏览

react-native - React Native 可折叠菜单

我正在做一个带有可折叠内容的模式,但我希望内容显示在菜单上方,我阅读了文档并发现“expandFromBottom --- 从底部而不是顶部展开内容”但无法使其工作.

这是我的模态

更具体地说,这里是我要编辑的可折叠

如何使文本出现在按钮上方?

谢谢