TypeError: Невозможно прочитать свойство 'map' из неопределенной реакции this.props.rsl ['data'] - PullRequest
0 голосов
/ 08 января 2019

У меня возникла проблема с функцией карты, которая отображает данные в журнале консоли. console.log("iiiiiiiiii",this.props.rsl['data']) но когда я использую функцию карты {this.props.rsl['data'].map(row=>{}), она выдает ошибку, говорящую

выдает ошибку, сказав, что TypeError: Не удается прочитать свойство 'map' из не определен

 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)

данные не отображаются, так как они не отображаются, может кто-нибудь подсказать, что происходит не так.

Ответы [ 2 ]

0 голосов
/ 03 февраля 2019

Я столкнулся с той же проблемой в приложении React, над которым я работаю. Я не уверен, что понимаю , почему это работает, но когда я дал массиву значение по умолчанию для пустого массива , прежде чем пытаться отобразить его, я смог отобразить его содержимое моего компонента.

В моем примере исходное назначение выглядело так:

 let { img, title, description, games } = this.state.eventData;

Затем я попытался отобразить массив игр следующим образом:

 <h3>Games:</h3>
    <ul>
      {games.map(g => <li>{g.name}</li> )}
    </ul>

При попытке кода выше, где я назначаю из eventData

объект и не установить по умолчанию, я получаю сообщение об ошибке games не определено.

Но когда я изменил это на это, это сработало:

 let { img, title, description, games=[] } = this.state.eventData;

 <h3>Games:</h3>
    <ul>
      {games.map(g => <li>{g.name}</li> )}
    </ul>

Надеюсь, это поможет вам и / или будущим людям найти этот ответ!

0 голосов
/ 08 января 2019

При начальной загрузке страницы rsl становится неопределенным, и вы можете решить проблему следующим образом

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