How to store like-button clicks in Database using vue.js - database

Question

I have a simple like button vue.js app for a website so that users can like or dislike an article. You can see the live site here:
https://thecitipost.com/?action=viewArticle&articleId=11
The code is working perfectly, but I need to be able to store the button click counters in my DB so they don't reset on page refresh. Can anyone shed some light on how to do this? I have scoured the internet and I can't find what I am looking for. Here is my code:
<div class="reaction-wrapper">
<div class="main">
<div id="app">
<!-- Reaction system start -->
<div class="reaction-container"><!-- container div for reaction system -->
<span class="reaction-btn"> <!-- Default like button -->
<span class="reaction-btn-emo like-btn-default"></span> <!-- Default like button emotion-->
<span class="reaction-btn-text">Like</span> <!-- Default like button text,(Like, wow, sad..) default:Like -->
<ul class="emojies-box"> <!-- Reaction buttons container-->
<li #click="likeIt" class="emoji emo-like" data-reaction="Like"></li>
<li #click="loveIt" class="emoji emo-love" data-reaction="Love"></li>
<li #click="HaHaIt" class="emoji emo-haha" data-reaction="HaHa"></li>
<li #click="WowIt" class="emoji emo-wow" data-reaction="Wow"></li>
<li #click="SadIt" class="emoji emo-sad" data-reaction="Sad"></li>
<li #click="AngryIt" class="emoji emo-angry" data-reaction="Angry"></li>
</ul>
</span>
<div class="like-stat"> <!-- Like statistic container-->
<span class="like-emo"> <!-- like emotions container -->
<span class="like-btn-like"></span> <!--given emotions like, wow, sad (default:Like) -->
</span>
<span class="like-details">Hover over the like button to see your options!</span>
</div>
<div id="likes-counter">
<ol>
<li>Likes:{{likes}}</li>
<li>Love:{{love}}</li>
<li>HaHa:{{HaHa}}</li>
<li>Wow:{{Wow}}</li>
<li>Sad:{{Sad}}</li>
<li>Angry:{{Angry}}</li>
</ol>
</div>
</div>
<!-- Reaction system end -->
</div>
</div>
</div>
<script src="https://unpkg.com/vue#2.0.7/dist/vue.js"></script>
<script>
new Vue({
el:'#app',
data:{
isHidden:true,
likes:0,
love:0,
HaHa:0,
Wow:0,
Sad:0,
Angry:0
},
methods:{
showIt:function(){
this.isHidden=false;
},
hideIt:function(){
this.isHidden=true;
},
likeIt:function(){
this.likes++;
},
loveIt:function(){
this.love++;
},
HaHaIt:function(){
this.HaHa++;
},
WowIt:function(){
this.Wow++;
},
SadIt:function(){
this.Sad++;
},
AngryIt:function(){
this.Angry++;
},
}
});
Any help would be greatly appreciated.
Thank you!