- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试遍历通过调用 API 获得的对象但是在将数据设置为状态 setNodesData
并从 nodesData
获取数据之后,但是当我尝试这样做我收到一条错误消息: TypeError: Object.entries requires that input parameter not be null or undefined in React Native
我也尝试过 for(const i in nodesData)
但我仍然收到一条错误消息,提示 expression expected
useEffect(() => {
if (apiHeaders) {
axios
.get(
"https://test-myways-anfhsya-asq.myways.in/api/****",
{
headers: apiHeaders,
}
)
.then((res) => {
console.log("API Call")
console.log(res?.data);
setNodesData(res?.data);
})
.catch((err)=>{console.log("error:",err)});
}
}, [apiHeaders]);
return (
{
Object?.entries(nodesData).forEach((i) => (
<View style={{ padding: 5 }}>
<View
style={{
flexDirection: "row",
alignItems: "center",
}}
>
<TouchableOpacity
onPress={(props) => props.navigation.navigate("CoursesPlaylistScreen")}
style={{
flexDirection: "row",
alignItems: "center",
justifyContent: "space-between",
flex: 1,
}}
>
<View
style={{
flexDirection: "row",
justifyContent: "space-between",
flex: 1,
}}
>
<Text
style={{
fontSize: 16,
color: "#000000",
fontWeight: "bold",
}}
>
{i}
</Text>
</View>
</TouchableOpacity>
</View>
数据:
{
"week1": {
"content": [
{
"moduleName": "HTML Crash course",
"moduleVideos": [
{
"title": "HTML Crash Course For Absolute Beginners",
"link": "https://youtu.be/*****",
"duration": "01:00:42"
}
]
},
{
"moduleName": "CSS Crash course",
"moduleVideos": [
{
"title": "CSS Crash Course For Absolute Beginners",
"link": "https://youtu.be/*****",
"duration": "01:25:11"
}
]
},
我只想得到几周,但我收到错误,我不知道该怎么做。
最佳答案
问题很可能发生在初始渲染上。您正在尝试将 undefined
转换为对象条目数组。
const [nodesData, setNodesData] = useState(); // <-- undefined initial state!
...
Object?.entries(nodesData).map( ... // <-- blows up with error
测试
const nodesData = undefined;
console.log(Object.entries(nodesData)); // error
const nodesData = {};
console.log(Object.entries(nodesData)); // []
.map
与 .forEach
当您将 Object?.entries(nodesData).map( ...
更改为 Object?.entries(nodesData).forEach( ...
时,您的编辑获胜't return anything to be rendered as .forEach
在技术上是无效的返回。将更改恢复为使用 .map
。
此外,由于条目的每个“值”仍然是一个对象,您需要选择要呈现的对象值。如果有任何嵌套数组,它们也需要映射到 JSX。
提供有效的初始状态。一个空对象就足够了。
const [nodesData, setNodesData] = useState({});
并且如果 nodesData
状态稍后变为未定义的偶然机会,请使用 null 检查或提供回退值。
nodesData && Object.entries(nodesData).map( ...
Object.entries(nodesData || {}).map( ...
理想情况下,您应该保持状态不变,至少始终是已定义的对象。
nodesData
周键如果您只需要 key ,那么您可以:
从条目中呈现键(回想一下,条目是一个键值对数组,即 [[key1, value1], [key2, value2], ...]
)
Object.entries(nodesData).map(([week, data]) => (
<View style={{ padding: 5 }}>
...
<Text .... >
{week} // "week1", "week2", etc...
</Text>
...
</View>
使用 Object.keys
获取仅键的数组
Object.keys(nodesData).map((week) => (
<View style={{ padding: 5 }}>
...
<Text .... >
{week} // "week1", "week2", etc...
</Text>
...
</View>
关于javascript - TypeError : Object. 条目要求输入参数在 React Native 中不为空或未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69694731/
我遵循了一本名为“Sitepoint Full Stack Javascript with MEAN”的书中的教程,我刚刚完成了第 6 章,应该已经创建了一个带有“数据库”的“服务器”。数据库只不过是
在 Jquery 中,我创建两个数组,一个嵌入另一个数组,就像这样...... arrayOne = [{name:'a',value:1}, {name:'b',value:2}] var arra
这个问题在这里已经有了答案: What is the explanation for these bizarre JavaScript behaviours mentioned in the 'Wa
我被放在别人的代码上,有一个类用作其他组件的基础。当我尝试 ng serve --aot(或 build --prod)时,我得到以下信息。 @Component({ ...,
我正在测试一些代码,并使用数据创建了一个 json 文件。 问题是我在警报中收到“[object Object],[object Object]”。没有数据。 我做错了什么? 这是代码:
我想打印 [object Object],[object Object] 以明智地 "[[{ 'x': '1', 'y': '0' }, { 'x': '2', 'y': '1' }]]"; 在 ja
我有一个功能 View ,我正在尝试以特殊格式的方式输出。但我无法让列表功能正常工作。 我得到的唯一返回是[object Object][object Object] [object Object]
在使用优秀的 Sim.js 和 Three.js 库处理 WebGL 项目时,我偶然发现了下一个问题: 一路走来,它使用了 THREE.Ray 的下一个构造函数: var ray = new THRE
我正在使用 Material UI 进行多重选择。这是我的代码。 {listStates.map(col => (
我的代码使用ajax: $("#keyword").keyup(function() { var keyword = $("#keyword").val(); if (keyword.
我遇到了下一个错误,无法理解如何解决它。 Can't resolve all parameters for AuthenticationService: ([object Object], ?, [o
我正在尝试创建一个显示动态复选框的表单,至少应选中其中一个才能继续。我还需要获取一组选中的复选框。 这是组件的代码: import { Component, OnInit } from '@angul
我正在开发 NodeJs 应用程序,它是博客应用程序。我使用了快速验证器,我尝试在 UI 端使用快速闪存消息将帖子保存在数据库中之前使用闪存消息验证数据,我成功地将数据保存在数据库中,但在提交表单后消
我知道有些人问了同样的问题并得到了解答。我已经查看了所有这些,但仍然无法解决我的问题。我有一个 jquery snipet,它将值发送到处理程序,处理程序处理来自 JS 的值并将数据作为 JSON 数
我继承了一个非常草率的项目,我的任务是解释为什么它不好。我注意到他们在整个代码中都进行了这样的比较 (IQueryable).FirstOrDefault(x => x.Facility == fac
我只是在删除数组中的对象时偶然发现了这一点。 代码如下: friends = []; friends.push( { a: 'Nexus', b: 'Muffi
这两个代码片段有什么区别: object = nil; [object release] 对比 [object release]; object = nil; 哪个是最佳实践? 最佳答案 object
我应该为其他人将从中继承的第一个父对象传递哪个参数,哪个参数更有效 Object.create(Object.prototype) Object.create(Object) Object.creat
我在不同的对象上安排不同的选择器 [self performSelector:@selector(doSmth) withObject:objectA afterDelay:1]; [self per
NSLog(@"%p", &object); 和 NSLog(@"%p", object); 有什么区别? 两者似乎都打印出一个内存地址,但我不确定哪个是对象的实际内存地址。 最佳答案 这就是我喜欢的
我是一名优秀的程序员,十分优秀!