I feel like my title is lil confusing (I am as well..) But, Can anyone help me with creating a new array from Objects list? I am getting :

from the server when I request getSearchList. I want to put those two lists into one list as AllTag that contains

1. all tags from tagList[] :

current : tagList:{{tag_no:1, tag_content:"#mood"},{tag_no:2, tag_content: "#food"}}

2. only nick_names and user_no but add @ in front of user_nickname :

current : {{user_no:1, user_nickname:'nickname1',user_email:'n@gmail.com',...}... } change to : {{user_no:1, user_nickname : '@nickname1'}, {user_no:2, user_nickname:'@nickname2'}...}

3. Map Together in AllTags{} :

I want => AllTags{{ tag_no:1, tag_content:"#mood"},{tag_no:2,tag_content:"#food"}...{user_no:1, user_nickname:"@nick1name"}, {user_no:2, user_nickname:"@nickname2"}}

Is this possible ??

Below is my axios and javascript code:

search.vue

import { getSearchList } from "@/api/searchAPI.js";
...
created() {
            /*const objData = {
                    tagList:[],
                    userList: [],
                },
                keys = { tagList: "tag_name", userList:"user_nickname" },
                result = Object.entries(objData).reduce(
                    (r, [key, array]) =>
                        array.map((v, i) => ({ ...r[i], [keys[key]]: v })),
                    []
                );*/

            console.log(result);
            getSearchList(
                (response) => {
                    this.AllTags = response.data;
                    console.log(this.AllTags);
                    console.log(this.AllTags.userList);
                },
                (error) => {
                    console.log(error);
                }
            );

searchAPI.js

import { apiInstance } from './index.js';

const api = apiInstance();

function getSearchList( param, success, fail) {
    api.get(`/challympic/search`, {params:param}).then(success).catch(fail);
}
  
export { getSearchList};