Combine two arrays by matching a shared identifier

Question

Combine two arrays by matching a shared identifier

let members=[{id:3, seal:'XXXXX', name:'Test'}, {}, {}]
axios.get("xxx" + seal + "/xx")
 .then(response => {
  this.articleStream = this.members.forEach(item => {
  response.data.map(i => (i.user_id = item.id));
 });
})

Upon executing the axios call, the articleStream array needs to cross-reference the user_id with the id in the members array and the seal which is provided during the axios call. It should then map the name from members to the articleStream. However, currently it is not returning the correct information.

The array returned from the axios call appears as follows:

[{ id: 5, user_id: 3},{}]

javascript json vue.js axios

Answer 1

Answer №1

const myGroup=[{id:3, secretCode:'XXXXX', title:'Testing'}, {}, {}]
axios.get("xxx" + seal + "/xx")
 .then(response => {
  this.articleStream = this.myGroup.forEach(member => {
  response.data.map(dataItem => {
   if (dataItem.user_id === member.id)) dataItem.title = member.title;
  };
 });
})

Answer 2

const myGroup=[{id:3, secretCode:'XXXXX', title:'Testing'}, {}, {}]
axios.get("xxx" + seal + "/xx")
 .then(response => {
  this.articleStream = this.myGroup.forEach(member => {
  response.data.map(dataItem => {
   if (dataItem.user_id === member.id)) dataItem.title = member.title;
  };
 });
})

Answer 3

Answer №2

If I understand your inquiry correctly, it seems like you are searching for a solution similar to the one below:

axios.get("xxx" + seal + "/xx")
.then(response => {
    this.articleStream = this.members.forEach(item => {
    response.data.map(i => {
      if(i.user_id == item.id){
        return [...i, item.name]
      }
    });
  });
})

This code snippet will append the user's name to each article where the user id and article user-id match.

If you wish to combine all data from both arrays, make the following modification:return [...i, item.name] change it to return [...i, ...item] in the provided example above

Answer 4

If I understand your inquiry correctly, it seems like you are searching for a solution similar to the one below:

axios.get("xxx" + seal + "/xx")
.then(response => {
    this.articleStream = this.members.forEach(item => {
    response.data.map(i => {
      if(i.user_id == item.id){
        return [...i, item.name]
      }
    });
  });
})

This code snippet will append the user's name to each article where the user id and article user-id match.

If you wish to combine all data from both arrays, make the following modification:return [...i, item.name] change it to return [...i, ...item] in the provided example above

Combine two arrays by matching a shared identifier

Answer №1

Answer №2

Similar questions

Creating HighStock charts on the server-side using NodeJS

Problem Alert: Click Event Not Functioning on Generated Links

Challenges with loading times in extensive AngularJS applications

Using Ajax to append form data to JSON is more efficient than using PHP alone

Tips for implementing an 'exclude' feature in TypeScript without encountering any error notifications

It's important to understand how to correctly send state values from a parent component to a child component

Is there a way to prevent the "undefined" message from displaying in the console when this code is run?

Create a new column in Material UI Grid by adding an empty div element instead of using padding

Error with redirect in Ajax request

Leveraging a combination of AngularJS directives within a single div element

Encountering issues with an Express Server when sending multiple AngularJS Post requests. Server crashes when attempting a second post request

CakePHP 1.3 - issue with JSON REST call not rendering correctly

Updating two separate <DIV> elements with a single AJAX request

Avoid receiving input for a button that is being covered by another button

Are SVGs with JavaScript for parallax effects?

Using jQuery to Retrieve Accurate User Identification - Making AJAX Requests

Codemirror - Advanced Auto-Suggest Feature with Separator

Remove the "hover effect" from an element using programming on mobile devices

Implementing automatic number increment in Vue.js forms

Can we use the function name as an argument for the setState method?