[英]Map is not defined React JS
I have a problem maping the component state. 我在映射组件状态时遇到问题。 I have this export: 我有这个出口:
export default[
{
'menu': 'Usuarios',
'url' : '',
'items':[
{
'title': 'Nuevo usuario',
'destino' : '/DashBoard'
},
{
'title': 'Actualizar datos',
'destino' : '/DashBoard'
}
]
},
{
'menu': 'Socios',
'url' : '',
'items':[
{
'title': 'Membrecias',
'destino' : '/DashBoard'
}
]
},
{
'menu': 'Clases',
'url' : '',
'items':[
{
'title': 'Nuevo usuario',
'destino' : '/DashBoard'
}
]
},
{
'menu': 'Productos',
'url' : '',
'items':[
{
'title': 'Nuevo usuario',
'destino' : '/DashBoard'
}
]
},
{
'menu': 'Compras',
'url' : '',
'items':[
{
'title': 'Nuevo usuario',
'destino' : '/DashBoard'
}
]
},
{
'menu': 'Ventas',
'url' : '',
'items':[
{
'title': 'Nuevo usuario',
'destino' : '/DashBoard'
}
]
},
{
'menu': 'Estadisticas',
'url':'/Dashboard'
},
{
'menu': 'Reportes',
'url': '/DashBoard'
}
]
The menu routes is not defined so assign '/ DashBoard' to all but it is not a problem. 菜单路由未定义,因此将“ / DashBoard”分配给所有菜单路由,但这不是问题。
I have the problem when I try to map the state of the component in the following way: 我尝试通过以下方式映射组件的状态时遇到问题:
// Dependencies
import React, {Component} from 'react';
//Data
import mdata from '../../Data/Settings/MenuDash';
class DropTownMenu extends Component{
constructor(){
super();
this.state={
data: mdata,
}
}
render(){
return(
<div className='DropTownMenu'>
{this.state.data.map((todo,i) =>
<div key={i}>
<span>{todo.menu}</span>
<span>{todo.url}</span>
<span>{todo.items.map((todo, i)=><span key={i}>{todo.title}</span>)}</span>
</div>
)}
</div>
);
}
}
export default DropTownMenu;
Use the 'span' tag just to test this I have to implement it as a list, but I'll take care of that. 使用'span'标记只是为了测试它,我必须将其实现为列表,但我会解决这个问题。 the question is that this does not give me errors in console but if in the browser, those errors are the following: 问题是,这不会给我控制台错误,但是如果在浏览器中,这些错误如下:
In your data array, some of the objects don't have an 'items' array property (last 2). 在您的数据数组中,某些对象没有'items'数组属性(最后2个)。
{
'menu': 'Ventas',
'url' : '',
//has items
'items':[
{
'title': 'Nuevo usuario',
'destino' : '/DashBoard'
}
]
},
// no items
{
'menu': 'Estadisticas',
'url':'/Dashboard'
},
{
'menu': 'Reportes',
'url': '/DashBoard'
}
You can either put in an undefined check or modify the original data so that all objects in the array has an 'items' property. 您可以进行未定义的检查,也可以修改原始数据,以便数组中的所有对象都具有“ items”属性。
<span>{Array.isArray(todo.items) && todo.items.map(item => ...)}</span>
Note that the error is saying that it cannot 'read property map of undefined', and it points to 'todo.items.map'. 请注意,该错误表明它无法“读取未定义的属性映射”,并且指向“ todo.items.map”。 It means 'todo.items' is undefined; 这意味着“ todo.items”是未定义的; not that 'map' doesn't exist on 'todo.items' (technically true, but doesn't pinpoint the problem directly). 不是“ todo.items”上不存在“地图”(技术上是正确的,但不能直接查明问题所在)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.