javascript - 无法合并两个对象数组

问题描述

我想合并从 API 调用中收到的两个对象数组（https://developers.themoviedb.org/3/getting-started/introduction这个）。我已经创建了这个简单的函数methods来合并 Vue 中的两个数组，但是每次我获得一个空数组

mergeArrays(arr1, arr2) {
          let arrMerged = [...arr1, ...arr2];
          return arrMerged;
    }

所以，我认为问题可能出在异步调用上。所以，为了确保数组在返回之前被填充，我放了这个 if 语句，但我什么也没得到，函数没有启动。

mergeArrays(arr1, arr2) {
          if (arr1.length == 19 && arr2.length == 16 ) {
              let arrMerged = [...arr1, ...arr2];
              return arrMerged;
          }
        }

数组是通过这种方式获得的：

 mounted () {
        // First Array
        // Obtaine movies genres and put them in an re-usable array 
        axios
            .get(`https://api.themoviedb.org/3/genre/movie/list`, {
                params: {
                            api_key: this.apiKey,
                            language: this.userLanguage,
                        },
            })
            .then((response) => {
                const genres = response.data.genres;
                genres.forEach(element => {
                    let genreId = element.id;
                    let genreName = element.name;
                    this.genresMovies.push( 
                        {
                            id: genreId, 
                            name: genreName
                        }
                    );
                });
            })

    // Second Array
    // Obtaine tv genres and put them in an re-usable array 
    axios
        .get(` https://api.themoviedb.org/3/genre/tv/list`, {
            params: {
                        api_key: this.apiKey,
                        language: this.userLanguage,
                    },
        })
        .then((response) => {
            const genres = response.data.genres;
            genres.forEach(element => {
                let genreObj = element;
                let genreId = element.id;
                let genreName = element.name;
                        this.genresTV.push( 
                        {
                            id: genreId, 
                            name: genreName
                        }
                    );
            });
        })

this.genresTV并且this.genresMovies是在此处定义data和填充的空数组。一旦填满，它们就会以这种方式出现：

Array 1

0:
id: 28
name: "Azione"

1:
id: 12
name: "Avventura"

2:
id: 16
name: "Animazione"

3:
id: 35
name: "Commedia"

4:
id: 80
name: "Crime"

5:
id: 99
name: "Documentario"

6:
id: 18
name: "Dramma"

7:
id: 10751
name: "Famiglia"

8:
id: 14
name: "Fantasy"

9:
id: 36
name: "Storia"

10:
id: 27
name: "Horror"

11:
id: 10402
name: "Musica"

12:
id: 9648
name: "Mistero"

13:
id: 10749
name: "Romance"

14:
id: 878
name: "Fantascienza"

15:
id: 10770
name: "televisione film"

16:
id: 53
name: "Thriller"

17:
id: 10752
name: "Guerra"

18:
id: 37
name: "Western"


Array 2

0:
id: 10759
name: "Action & Adventure"

1:
id: 16
name: "Animazione"

2:
id: 35
name: "Commedia"

3:
id: 80
name: "Crime"

4:
id: 99
name: "Documentario"

5:
id: 18
name: "Dramma"

6:
id: 10751
name: "Famiglia"

7:
id: 10762
name: "Kids"

8:
id: 9648
name: "Mistero"

9:
id: 10763
name: "News"

10:
id: 10764
name: "Reality"

11:
id: 10765
name: "Sci-Fi & Fantasy"

12:
id: 10766
name: "Soap"

13:
id: 10767
name: "Talk"

14:
id: 10768
name: "War & Politics"

15:
id: 37
name: "Western"

我在第二次之后以这种方式调用该函数axios

const arr = this.mergeArrays(this.genresMovies, this.genresTV);

我不知道出了什么问题

标签： javascriptarraysvue.jsobject

javascript - 无法合并两个对象数组

问题描述

解决方案

推荐阅读