Checkbox inside the table and get or remove id using lodash

Good day everyone,

I'm trying to create a table that has checkbox. When I click the checkbox, the id will be added inside the array of object. When I unchecked the specific checkbox, it will remove the id from the array.

So far here's my sample code.

HTML Table

...
<td><input type="checkbox" @click="checkThis(id)" /></td>
...

My sample vue.js code

import _ from 'lodash'

export default {
    data(){
        return{
            myArray: []
        }
    },
    methods:{
        checkThis(id){
            // for removing an object inside the array
            _.remove(this.myArray, {myArrayId: id})

            // way to push to array
            this.myArray = [...this.myArray, {
                myArrayId: id
            }]
        }
    }
}

This code to remove the id if the user uncheck the specific checkbox.

_.remove(this.myArray, {myArrayId: id})

But my problem is, whenever I click the checkbox, it doesn't know whether which id should it remove or if the checkbox is already check or uncheck for the specific id.

What I want to do is, If it is checked in the specific checkbox, it will add the id inside the array, if it is unchecked, then it remove the id of the checkbox inside the array.

Any help please?