问题标签 [react-flatlist]

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 投票
4 回答
134 浏览

javascript - 任何人都知道在我从中删除 1 项后如何使平面列表重置 ID 号

就像我的标题说的那样,尽管下面是一个示例,但我对此感到很挣扎

这是我删除 id 为“2”的项目后的平面列表,我希望 id 3 变为 2,id 4 变为 3,因此删除 id 2 后的平面列表会喜欢

这是我的代码

以下是我的截图平面列表: https ://uphinh.org/image/9OLoCN

0 投票
1 回答
159 浏览

react-native - extraData 钩子不适用于 2 个 flatLists 之一

所以我正在尝试为我的网站构建一个新闻提要阅读器。它非常基本,只有 2 个平面列表。一个垂直列出文章,另一个水平列出网站。单击水平项目时,它会更新 2 个不同的状态设置。这 2 个设置被设置为 flatLists 的 extraData。按下后水平的会重新渲染,但垂直的不会。

onPress 正在更新站点和 selectedId 状态,当站点 flatList 重新呈现并显示背景颜色更改时,artile flatList 不会使用新提要重新呈现。

这是代码。

0 投票
0 回答
31 浏览

reactjs - reactjs flatlist 降序和升序不适用于下拉菜单

我rewest到reactjs。更改下拉列表中的表顺序不会更改。

组件确实挂载事件功能***

} }

表体的 renderAgent 函数

这是我的 onChange 函数

下拉式菜单

平面列表表

当页面加载和硬编码下降为 true 时,它​​可以工作,但不会通过下拉菜单更改内容。成功响应 orderBy 状态更改。请帮我修复

0 投票
1 回答
444 浏览

javascript - React Native - 渲染从 API 获取数据的屏幕时出现“未定义不是对象”错误

我是 React Native 的新手。我正在制作一个从 API 获取数据并将其显示在屏幕上的应用程序。渲染此屏幕时出现以下错误:渲染错误 undefined is not an object (evalating 'character.origin.name')

这里的代码在屏幕上:

我检查了来自 API 的传入数据。是因为页面渲染时数据还没有来自api的错误吗?

这里来自 API 的传入数据示例:

0 投票
1 回答
187 浏览

react-native - 我无法在反应原生平面列表中写入输入

我正在尝试学习 React Native。我有一个示例,但 FlatList 中存在问题。我在页脚组件中有一个 TextInput。没有错误,但是当我尝试写入输入字段时,键盘无法保留。它只是出现然后消失。我该如何解决这个问题?这是我的代码:

0 投票
1 回答
38 浏览

reactjs - 我编写了用于在反应中列出书籍的代码,但 FlatList 在我的代码中不起作用,我该如何解决?

我编写了以下代码用于在平面列表中列出书籍,但它不起作用,它说“元素类型无效:需要一个字符串......”

FlatList 不起作用

书籍.js

0 投票
0 回答
136 浏览

javascript - React Native:无法在 FlatList 中设置图像 uri

我正在尝试访问/wp-json/wp/v2/media/ wordpress API 并从guid.rendered获取图像的 uri并将其设置为 FlatList 内的 Image 但出现以下错误

您试图在一个本来是不可变的对象上设置键 _v 值为 1 并且被冻结。

主页.js

getBlogPostsImage()

}

如果特色图像存在,我也尝试获取,但这也不起作用

更新

使用此处提供的解决方案,URI 现在出现在/wp-json/wp/v2/posts/id中,但不会被获取!

更新的平面列表

0 投票
0 回答
49 浏览

reactjs - React Native - 编辑平面列表,但平面列表保持不变

我正在尝试为我的项目编辑我的平面列表。当主题添加到平面列表中时,值是通过 subjectInput、markInput 和gradeInput 状态添加的,然后我想使用 newMarkinput 和 newGradeInput 状态编辑该特定主题的标记和等级,我期待 newMarkInput 和 newGradeInput 覆盖当前的 markInput 和 GradeInput 但我当前的结果是 newMarkInput 和 newGradeInput 仍然是一个空数组,尽管输入了 newMarkInput 和 newGradeInput 值。

控制台日志结果:80 A [{"Grade": "A", "Mark": "90", "NewGrade": [""], "NewMark": [""], "Selected": true, "Subject ": "数学", "id": "0.9740256550962071"}]

我尝试在平面列表中添加 ExtraData 但不确定我是否正确使用它

但我怀疑导致这种情况发生的可能是 updateSubject() 但我不确定如何解决它

我的状态

我的 addSubject()

我更新主题项目的功能

我的单子

0 投票
1 回答
46 浏览

reactjs - 保存页面时重新呈现 FlatList 项目

问题是当我保存页面时,已经渲染的项目再次重新渲染,显示错误“警告:遇到两个具有相同键的孩子,AhO8HUMnDjAH1Mh8u2jM.键应该是唯一的,以便组件在更新时保持其身份。非唯一键可能导致孩子被重复和/或省略——这种行为不受支持,可能会在未来的版本中改变。”

这是我的代码 PLs note 我使用了分页和无限滚动列表方法。

0 投票
1 回答
52 浏览

react-native - 使用 react native Flatlist 显示来自文件名数组的图像

我在文件夹 assets/dummy-data/Avatars.ts 中创建了一个名为 avatars 的虚拟数据文件。

我想要做的是将这些数据加载到另一个文件中,然后用它们制作一个 Flatlist 组件。我的代码是:

这是我得到的错误: 错误的屏幕截图

谢谢