axios post without refresh page - laravel

Question

methods: {
onShowModal(idWinnerPrize, idPrize, curUser) {
this.userEdit = _.cloneDeep(curUser);
if (idWinnerPrize === idPrize) {
this.confirmAward = false;
this.isDelete = true;
this.isFull = false;
this.userEdit.prize = null;
} else {
this.confirmAward = true;
this.isDelete = false;
let countPrize = this.winners.reduce((acc, cur) => {
if (cur.prize_id === idPrize) {
acc += 1;
}
return acc;
}, 0);
const currentPrize = this.prizes.find(
item => item.id === idPrize
);
if (currentPrize && currentPrize.quantity <= countPrize) {
this.isFull = true;
} else {
this.userEdit.prize = idPrize;
this.isFull = false;
}
}
this.showModal = true;
},
onCloseModal() {
this.showModal = false;
this.notify = false;
},
this is my function show and close modal, and use axios.post to update
async onEdit() {
let res = null;
let userIndex = this.winners.findIndex(
item => item.id == this.userEdit.id
);
res = await axios.post( this.isFull ? REMOVE_PRIZE : EDIT_PRIZE, { id: this.userEdit.id, prize_id: this.userEdit.prize } ).then((res) => { return res.data }).catch((error => {
return error
}));
res = true;
if (userIndex > -1 && res) {
this.winners[userIndex] = this.userEdit;
}
this.showModal = false;
},
updated() {
this.prizes = this.contest.prizes;
this.winners = this.posts.data;
}
},
props: ['contest', 'actionUrl', 'method', 'posts'],
data() {
return {
notify: true,
showModal: false,
confirmAward: true,
isDelete: false,
isFull: false,
userEdit: {},
prizes: [],
winners: []
};
},
mounted() {
this.showModal = true;
}
};
that my Vue component, I want to update the page without refresh the page after I click on edit, I don't know why Axios post can't update data. If I update, I need to refresh the page to see my updated data