时间戳

首页 > 解决方案 > TypeError：无法读取未定义的属性“地图”反应this.props.rsl ['数据']

reactjs - TypeError：无法读取未定义的属性“地图”反应this.props.rsl ['数据']

问题描述

我遇到了 map 函数的问题，它在控制台日志中显示数据， console.log("iiiiiiiiii",this.props.rsl['data']) 但是当我使用 map 函数时{this.props.rsl['data'].map(row=>{})，它会抛出一个错误说

它抛出错误说 TypeError: Cannot read property 'map' of undefined

 render(){
    const {classes}=this.props;
     console.log("iiiiiiiiii",this.props.rsl['data'])
    return(
        <Paper className={classes.root}>
            <div className={classes.tableWrapper}>
                <Table>
                    <EnhancedTableHead rows={this.props.rowsHdr} />
                    {console.log("this.props.rowsHdr",this.props.rowsHdr)}
                    <TableBody>
                        {this.props.rsl['data'].map(row=>{
                            return(
                                <TableRow key={row.bankId}
                                  hover
                                  onClick={e=>console.log("e",e)}
                                >
                                    <TableCell>{row.bankName}</TableCell>
                                    <TableCell>{row.bankCode}</TableCell>
                                    <TableCell>{row.city}</TableCell>
                                    <TableCell>{row.country}</TableCell>
                                    <TableCell>{row.status}</TableCell>
                                    <TableCell>
                                        <Button variant="contained" className={classes.button} onClick={()=>this.handleViewProfile(row.bankCode)}>
                                            View
                                        </Button>
                                    </TableCell>
                                </TableRow>
                            )
                        })}                            
                    </TableBody>
                </Table>                    
            </div>
        </Paper>
    )
   }

  iiiiiiiiii 

  (4) [{…}, {…}, {…}, {…}]
   0: {status: "ACTIVE", zipcode: "500018", country: "India"}
    1: {status: "ACTIVE", zipcode: "500019", country: "India"}
   2: {status: "ACTIVE", zipcode: "500026", country: "India" }
   3: {status: "ACTIVE", zipcode: "500028", country: "India"}
   length: 4
   __proto__: Array(0)

数据没有呈现，因为它没有映射，任何人都可以指导我知道出了什么问题。

标签： reactjsmaterial-ui

解决方案

初始页面加载时，rsl未定义，您可以通过以下方式解决问题

{this.props.rsl && this.props.rsl['data'].map(row => { ........... })

推荐阅读