Javascript 在与API调用关联的函数中：Uncaught（In promise）TypeError:cannotreadproperty'；包括'；未定义的

我正在使用电影DB API（这一个） 我用VUE在我的页面中打印我的通话结果。 API为我提供了实现目标所需的所有数据，即

如您所见，在节目名称下有与该名称相关的流派。 让我们以API为我提供A-Team时获得的对象为例

"backdrop_path": "/ggPjnOA5sap6wyuAGUY7kwRseEi.jpg",
            "first_air_date": "1983-01-23",
            "genre_ids": [
                10759
            ],
            "id": 1516,
            "media_type": "tv",
            "name": "A-Team",
            "origin_country": [
                "US"
            ],
            "original_language": "en",
            "original_name": "The A-Team",
            "overview": "Un commando di ex-combattenti della guerra del Vietnam chiamato A-Team (Squadra A), un tempo appartenenti ai corpi speciali dell'esercito degli Stati Uniti, viene accusato ingiustamente di aver rapinato la banca di Hanoi. Evasi in maniera rocambolesca, vivono ora in fuga, ricercati e braccati dalle autorità per un reato che non hanno mai commesso. I componenti della squadra sopravvivono prestando servizio come mercenari e venendo, nella quasi totalità degli episodi, assoldati da varie persone o gruppi di persone che vivono oppresse da situazioni d'ingiustizia nei propri confronti. Grazie alle qualità militari e umane dell'A-Team, ogni episodio si risolve in maniera definitiva a favore dei più deboli. Pur essendo visti come mercenari dagli altri personaggi della serie, i membri dell'A-Team sono dunque schierati sempre dalla parte del bene. Famoso è il loro furgone GMC Vandura nero e grigio con 2 strisce rosse laterali che si uniscono sullo spoiler superiore, usato come mezzo principale di trasporto dell'A-Team.",
            "popularity": 141.786,
            "poster_path": "/iJsueZM8TqQzeB55tol4mnyQzb9.jpg",
            "vote_average": 7.4,
            "vote_count": 574
        },

如您所见，有一个子数组名为

genre\u id

，其中包含此特定节目的相关流派id。为了获得名称，我使用了API的另一个调用，它为我提供了一个对象数组，其中每个对象都有两个属性，一个流派的id和一个流派的名称。因此，从这个数组中，您可以轻松获得节目的相关流派名称并将其打印出来。 我以这种方式执行此操作，对从shows的API调用获得的数组执行

.map

：

searchShow（）

是一个函数，当您在上图中看到的

input

中按enter键时启动。userSearch实际上是与该

input

关联的

v-model

searchShow() {
            axios
                // this is the call that provides me an array of object like the A-Team's one seen before
                .get(`https://api.themoviedb.org/3/search/multi`, {
                params: {
                            api_key: this.apiKey,
                            query: this.userSearch,
                            language: this.userLanguage,
                        },
                })
                .then((response) => {
                    const result = response.data.results;
                    // I save result in an empty array created in data 
                    this.searchResults = result;

                    // I insert a new property inside the array obtained right now,
                    // this property provides me genres name
                    
                    const newArray = this.searchResults.map ((element) => {
                        let objectResults = element.genre_ids;
                        let object = element;
                        // object.genres_name it's an empty array where I save in my results
                        object.genres_name = [];
                        // this.genresList it's the array in which I've saved the API call that gives me objects with ids and genres's name
                            this.genresList.forEach(genre => {
                            // ids of genres are the same everywhere. If the ones in the 
                            // genresList array are included in each element.genre_ids
                            // then push the name as an object, so it's printable in HTML
                            if (objectResults.includes(genre.id)) {
                                object.genres_name.push(
                                    {
                                        genre: genre.name
                                    
                                    }    
                                    );
                                }
                            })
                            
                    // return the element updated
                    return object;
                    })
                    // this.arrayProva is now equal to the map of the original array and it's
                    // the array printed in HTML
                    this.arrayProva = newArray;
                });
        },

有了它，我可以很容易地在HTML中打印流派的名称，因为我已经添加了一个依赖于现有属性的新属性。当一个节目没有关联任何流派，可能是一个不太出名的节目，但它打断了我的项目，因为出现了错误，vue不再打印搜索结果，问题就出现了。 之所以会出现这种情况，是因为单个元素没有我用于将流派名称添加到任何单个节目中的子数组流派ID。

---

如何避免这种情况？

如果问题是您只需要处理API结果中未定义

元素.genre_id

的情况，我认为您可以简单地将

objectResults

的赋值更改为：

let objectResults = element.genre_ids || [];

---

如果从API获得的数组为null或未定义，则将提供默认的空数组。

谢谢，我甚至不知道您可以用这种方式声明变量