[英]JSX array.map undefined boolean data
我试图在表格行中显示和映射我的对象,但我的布尔数据将返回为未定义,我什至无法将它们转换为字符串,解决方案是什么?
在映射中查看 user.isenable 和 user.isonline ...
这是我试过的...
import { component, Fragment } from 'react'
class Users extends Component {
constructor(props) {
super(props);
this.state = {
users: []
};
}
componentDidMount() {
const url = "http://localhost:4000/api/user";
// AXIOS REQUEST
axios.get(url).then(res => {
this.setState({ users: res.data });
console.log(this.state.users);
});
}
render() {
const users = this.state;
console.log(this.state.users.isenbale);
return (
<table id="users">
<tr>
<th>is Enable</th>
<th>is Online</th>
</tr>
{this.state.users.map(user => {
return (
<tr key={user.nationalcode}>
<td>{user.isEnable.toString()}</td>
<td>{user.isOnline.toString()}</td>
</tr>
);
})}
</table>
);
}
}
res.data
& this.state.users
控制台日志是一样的。
(5) [{…}, {…}, {…}, {…}, {…}]
0: {nationalcode: 134556778, stockcode: "md3456", firstname: "ali", lastname: "khodabakhashi", isenable: true, …}
1: {nationalcode: 1334853905, stockcode: "md4f5789", firstname: "saeed", lastname: "mohammad", isenable: true, …}
2: {nationalcode: 11313, stockcode: "31313", firstname: "1313", lastname: "1313", isenable: null, …}
3: {nationalcode: 4151515, stockcode: "151", firstname: "5131", lastname: "3114", isenable: null, …}
4: {nationalcode: 123456789, stockcode: "3131", firstname: "31", lastname: "3131", isenable: null, …}
length: 5
__proto__: Array(0)
有两个问题。
isenable
。 但是,您正在尝试引用isEnable
isenable
字段为null
。 这没有 toString 方法由于 null 是假的,您可以将其短路。
这是一个例子
在数据中,您收到的isenable
都是小写的,但在代码中,您将它用作isEnable
,javascript 变量名称区分大小写,因此引擎将它们视为两种不同的东西。
将代码更改为user.isenable
,它应该可以工作
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.