How to preserve the items stored in an array in Vue - arrays

Question

I have the code below that adds the item to the array if the checkbox is clicked. But, when I clicked a new item, the recently added item is replaced with the new one. Please see below:
data(){
return{
selected:[],
select:true,
}
},
METHOD
addMe(item){
if(this.select == true){
this.selected.push(item.emp_key)
}
}
So if my array (selected) has already a data, let's say 1, (added when checkbox is clicked), and then I clicked item 2, item 1 is removed, replaced with 2 and so on. Anyone can help me on this?

Answer 1

Pushing onto an array does not replace the array. The below is your code, with a fake incrementing ID number added to show different values pushed onto this.selected:
Vue.component('demo', {
template: '<div><button v-on:click="addMe({emp_key: fakeid++})">Click me</button> {{selected}} </div>',
data() {
return {
selected: [],
select: true,
fakeid: 1
}
},
methods: {
addMe(item) {
if (this.select == true) {
this.selected.push(item.emp_key)
}
}
}
});
new Vue({
el: '#app'
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.0/vue.js"></script>
<div id="app">
<demo></demo>
</div>

Answer 2

#ramedju try this hope it will help you
<script>
var arr=[]
export default {
data(){
return{
select:true,
}
},
methods:{
add(){
if(this.select== true){
arr=arr.concat(item.emp_key)
}
console.log(arr)
}
}
}
full code which i had use during testing
<template>
<div>
<input type="checkbox" name="" value="1" v-model="select">
<button type="submit" class="btn btn-sm btn-primary" #click.prevent="add()"><i class="fa fa-dot-circle-o"> </i>Success</button>
</div>
</template>
<script>
var arr=[]
export default {
data(){
return{
select:1,
}
},
methods:{
add(){
var item="1"
arr=arr.concat(item)
console.log(this.select)
console.log("arr")
console.log(arr)
}
}
}
</script>
result of console log
arr
["1"]
arr
["1","1"]
arr
["1","1","1"]