问题标签 [react-native-sectionlist]

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 回答
7984 浏览

json - React-Native:嵌套在 SectionList 中的平面列表

我正在尝试在部分列表中呈现几个平面列表。最终目标是这样的:

一个包含多个部分(您过去的订单、午餐时间等)的提要页面。

但是,我似乎无法让它正确渲染。它多次渲染同一个项目。

JSON 对象如下所示:

我想要有“流行运动鞋”、“流行街头服饰”和“最近上传”的部分。该对象应在其各自的部分下方呈现。

请帮我弄清楚我做错了什么。我知道 sectionList 必须有 aData和 a Title。但是如果我想为每个列表显示多个属性,我应该把什么作为数据。

0 投票
1 回答
419 浏览

javascript - Javascript/React Native 循环仅将变量更新为最后一个值

我正在使用 react native 循环来显示节标题和数据。

我的预期输出将是:

> 第 0 节

数据1 数据2

> 第 1 节

数据1 数据2

> 第 2 节

数据1 数据2

这将根据循环编号循环该部分

但是,实际输出是这样的: 实际输出

它只显示最后一个循环值

这个问题有什么解决办法吗?非常感谢

0 投票
1 回答
506 浏览

reactjs - 当某些项目以反应本机呈现时如何执行功能?

我有一个联系人部分列表,我在其中显示用户的设备和在线联系人。在线联系人 api 不会一次给我所有的联系人。所以我必须实现一些分页。我还获取所有设备联系人和在线联系人的第一页并将它们排序以显示在 sectionlist 中,但问题是,要加载更多联系人,我必须跟踪在我的状态和渲染功能中呈现的最后一项我我正在调用分页功能来加载更多联系人。然后我正在更新获取的在线联系人的状态。但这是一个不安全的操作,有没有更好的方法来实现这一点?

我想在特定项目呈现时执行一个函数,它可以更新状态。

这是一些代码:ContactList.tsx

0 投票
1 回答
69 浏览

javascript - 尝试在 JSON 中的两个项目上设置不同的样式

我尝试构建一个新闻应用程序,在 MainPage 上显示新闻项目的概述。需要使用 FlatList 将前 3 个项目与其他项目呈现不同。

  • 第一项是 100% 背景图像,上面有一些文字(这样做是:if index === 0))
  • 第二项和第三项需要是带有连续标题的背景图像(因此彼此相邻)
  • 其余的是一个包含图像、标题和日期的列表(在彼此下方)

我尝试了所有方法,但第 2 项和第 3 项不起作用。

尝试了这个小基本测试:

有人可以指出我正确的方向吗?

例子:

我需要的例子

0 投票
2 回答
580 浏览

react-native - react-native 部分列表数据格式问题?

如何在 react-native 的部分列表中显示以下对象数组

我想将“附加产品”和“附加产品二”显示为部分的标题,并将对象中的标签显示为内容项。我该怎么做?我应该转换为任何其他格式以在部分列表中显示它吗? -本国的?

0 投票
1 回答
1385 浏览

react-native - 向列表中添加新项目时的 SectionList 重复项目(也在 FlatList 中)

渲染 SectionList 时遇到奇怪的问题。向列表中添加新项目时,先前添加的项目重复。在第一次渲染和第一个项目添加时不会发生,只有在第二次添加新项目然后继续时才会发生

这是代码:

我检查了我正在传递的数组,其中没有重复的数据,而且 renderItem 日志看起来也很好

0 投票
0 回答
170 浏览

react-native - 反应原生。节列表。如何限制项目并通过按钮单击全部显示?

我是新来的React Native。我有SectionList并展示sectionHeader了一些物品。我想要实现的目标:如果列表中有超过 2 个元素,则只显示 2 个,并在下面绘制“全部显示”按钮。通过单击按钮,我想显示所有元素。

0 投票
1 回答
1180 浏览

javascript - SectionList React Native 中的选项卡

我们可以在 SectionList 中添加像这个库https://github.com/bogoslavskiy/react-native-tabs-section-list这样的标签吗?我尝试了上面的库,它已经过时并且不起作用。谁能指导我如何在部分列表中将标题显示为选项卡。我在 React 网站上阅读了 Section List 的官方文档,官方没有这个功能。我在 Github 上找到了这个https://github.com/bogoslavskiy/react-native-tabs-section-list库,但我认为它不适用于最新的世博会版本。我将 expo 36 用于我的 react native 项目。

我的部分列表代码:

0 投票
0 回答
55 浏览

react-native - 嵌套 React-Native FlatList 组件并接收这两个项目

我正在尝试显示一个 FlatList 项目,每个项目都包含一个相同按钮的 FlatList。单击其中一个按钮时,我希望同时接收父 FlatList 项和按钮对应的值。

我尝试了以下方法但没有成功(timeItem 未定义):

我知道SectionLists,因此也试图使我的父FlatList的每个项目都成为一个包含项目和timeSlots数组的对象,但是,我不确定如何在renderItem部分中获取标题:

SectionList 代码截图:

这些方法哪里出错了?我对 React Native 还很陌生,所以我很有可能错过了一些非常简单的东西。

0 投票
2 回答
782 浏览

react-native - 如何在 react-native 中使用 sectionList 进行导航?

我创建了 12 个元素的部分列表。这是我的代码,

现在我需要知道是否按此列表中的任何项目,然后导航到每个屏幕。这意味着如果我触摸奥迪然后导航到奥迪页面。这个怎么做?或者知道如何在没有节列表但看起来像的情况下做到这一点?