我的map函数出错了。
我正在跟随一个reactjs
教程学习,当我将一个组件状态的值传递到另一个组件时,我不断遇到问题。
我使用axios.get()
连接后端。
export default class Viewcustomer extends React.Component{
constructor(props) {
super(props)
this.state = {
Id:"",
name:"",
fax:"",
NIC: "",
type: "",
email: "",
website: "",
address: "",
phoneNo: "",
DOB: "",
note: "",
customer:[]
}
}
onChange = (e) => {
this.setState({[e.target.name]: e.target.value})
}
componentDidMount() {
axios.get(`http://localhost:5001/customer/view`)
.then(res => {
const customers = res.data;
this.setState({ customers });
})
}
render(){
return(
<table width="100%">
<tr>
<th>Id</th>
<th>name</th>
<th>fax</th>
<th>NIC</th>
<th>type</th>
<th>email</th>
<th>address</th>
<th>phoneNo</th>
<th>DOB</th>
<th>note</th>
</tr>
//Error raised by this line of code
{ this.state.customers.map(customer =>
<tr>
<td>{customer.Id}</td>
<td>{customer.name}</td>
<td>{customer.fax}</td>
<td>{customer.NIC}</td>
<td>{customer.type}</td>
<td>{customer.email}</td>
<td>{customer.address}</td>
<td>{customer.phoneNo}</td>
<td>{customer.DOB}</td>
<td>{customer.note}</td>
</tr>)}
</table>
)
}
}
编辑
错误与引号标记的行有关,由map()函数引发的问题,但根本问题是this.state.customers
为 undefined
。
this.state
的时候,你打错了字,customer
应该是customers
。 - Ian Kemp