Блог

получение ошибки url undefined в теге img ниже, большинство ссылок, передаваемых в src, работают, поскольку они поступают из spotify api, но я предполагаю, что даже некоторые источники, которые доказывает spotify api, сломаны, так как мне обрабатывать тег img для неработающих ссылок, поскольку в настоящее время я получаю ошибка «url не определен»

                 <GridList cellHeight={130} style= {{margin:0}} className="gridList" cols={2}>
                    {
                        this.state.fixedArtist.map((artist, index) => (
                            <GridListTile key={index}>
                                <a className="rank-song-label" key={index} href={artist.uri} >
                                        <img src={artist.images[0].url} className="rank-album-cover" alt="Album Cover" />
                                    
                                        <span className="rank-song_name"> {artist.name}</span>
                                    </div>
                                </a>
                            </GridListTile>

                        ))
                    }
                </GridList>
 

если вы хотите скрыть тег img, если URL-адрес изображения недоступен, вы можете сделать следующее,

 <GridList cellHeight={130} style= {{margin:0}} className="gridList" cols={2}>
                    {
                        this.state.fixedArtist.map((artist, index) => (
                            <GridListTile key={index}>
                                <a className="rank-song-label" key={index} href={artist.uri} >
                                  {artist.images amp;amp; <img src={artist.images[0].url} className="rank-album-cover" alt="Album Cover" />}
                                    
                                        <span className="rank-song_name"> {artist.name}</span>
                                    </div>
                                </a>
                            </GridListTile>

                        ))
                    }
                </GridList>
 

если вы хотите назначить пустой src или URL по умолчанию

  <GridList cellHeight={130} style= {{margin:0}} className="gridList" cols={2}>
                        {
                            this.state.fixedArtist.map((artist, index) => (
                                <GridListTile key={index}>
                                    <a className="rank-song-label" key={index} href={artist.uri} >
                                      {artist.images amp;amp; <img src={artist.images.length>0?artist.images[0].url:'image not available url'} className="rank-album-cover" alt="Album Cover" />}
                                        
                                            <span className="rank-song_name"> {artist.name}</span>
                                        </div>
                                    </a>
                                </GridListTile>
    
                            ))
                        }
                    </GridList>