I have an array of objects like so:

"followers": [
        {
            "id": "1be87842-2f7f-4e3b-8fde-9a998feb3a01",
            "bug_id": "4ae2707b-07ef-4e07-95da-77855c67fece",
            "user_id": "e9e81aa2-4994-483d-a3a7-3b88491f1fda",
            "username": "texample1",
            "name": "Test Example1",
            "created_at": "2018-11-27 21:01:42",
            "updated_at": "2018-11-27 21:01:42",
            "deleted_at": null
        },
        {
            "id": "7bd1fa5f-4109-4beb-b53a-fb03a1d23536",
            "bug_id": "4ae2707b-07ef-4e07-95da-77855c67fece",
            "user_id": "e9e81aa2-4994-483d-a3a7-3b88491f1fda",
            "username": "texample1",
            "name": "Test Example2",
            "created_at": "2018-11-27 21:01:48",
            "updated_at": "2018-11-27 21:01:48",
            "deleted_at": null
        }
    ]

and I am attempting to remove one object by it's index with the following code in my vuex store:

  let followersArray = state.bugs.find(b => b.id === follower.bug_id).followers
  let index = followersArray.indexOf(follower)
  followersArray.splice(index, 1)

I am passing an entire follower object through to this mutation, then finding the followers array on the bug object, finding the index and attempting to splice it from the full bug object's array of follower objects. This code removes another follower from the bug. The index logs as -1 and it should be 1. Anyone see what I'm missing here? If I could get the correct index, I would also add an if(index !== -1)) in there.

I have an array of objects like so:

"followers": [
        {
            "id": "1be87842-2f7f-4e3b-8fde-9a998feb3a01",
            "bug_id": "4ae2707b-07ef-4e07-95da-77855c67fece",
            "user_id": "e9e81aa2-4994-483d-a3a7-3b88491f1fda",
            "username": "texample1",
            "name": "Test Example1",
            "created_at": "2018-11-27 21:01:42",
            "updated_at": "2018-11-27 21:01:42",
            "deleted_at": null
        },
        {
            "id": "7bd1fa5f-4109-4beb-b53a-fb03a1d23536",
            "bug_id": "4ae2707b-07ef-4e07-95da-77855c67fece",
            "user_id": "e9e81aa2-4994-483d-a3a7-3b88491f1fda",
            "username": "texample1",
            "name": "Test Example2",
            "created_at": "2018-11-27 21:01:48",
            "updated_at": "2018-11-27 21:01:48",
            "deleted_at": null
        }
    ]

and I am attempting to remove one object by it's index with the following code in my vuex store:

  let followersArray = state.bugs.find(b => b.id === follower.bug_id).followers
  let index = followersArray.indexOf(follower)
  followersArray.splice(index, 1)

I am passing an entire follower object through to this mutation, then finding the followers array on the bug object, finding the index and attempting to splice it from the full bug object's array of follower objects. This code removes another follower from the bug. The index logs as -1 and it should be 1. Anyone see what I'm missing here? If I could get the correct index, I would also add an if(index !== -1)) in there.

• javascript
• vue.js
• ecmascript-6
• vuejs2
• vuex

• if you use "followers": {} instead of "followers": [] you can name the keys which would make grabbing by index simpler. – admcfajn Commented Nov 27, 2018 at 22:57

3 Answers 3

You could use findIndex() function and return the index of the follower based on his id :

      let index = followersArray.findIndex(i => i.id === follower.id);

Example :

let items = [{
  name: "aaa"
}, {
  name: "bbb"
}, {
  name: "ccc"
}];
let c = {
  name: "ccc"
};
let index = items.findIndex(item => item.name === c.name)

console.log(index)

When you run this code and it returns a -1:

let index = followersArray.indexOf(follower);

that means that the follower object is not contained in followersArray. The followersArray likely contains a copy of the follower object -- not a reference to the same object.

Even if the follower object has the same attributes and attribute values as the object in followersArray[1], the indexOf will return a -1 unless they are the same exact object.

Now if you just want to find an object in the array with a matching attribute value (such as id) then you could use map or findIndex to do so:

let index = followersArray.map(i => i.id).indexOf(follower.id);

If you print the result of followersArray in the console what does it show? If im correct find returns an array, even if it's only 1 element, try with this

let followersArray = state.bugs.find(b => b.id === follower.bug_id).followers[0]