<!DOCTYPE html> <html> <head> <title>Vue Project</title> <meta content="text/html;charset=utf-8" http-equiv="Content-Type"> <meta content="utf-8" http-equiv="encoding"> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> <script type="text/javascript" src="js/vue.js"></script> </head> <body> <div id="app" class="container"> <div class="col-md-6 col-md-offset-3 mb-9" style="margin-bottom:100px; "> <button v-on:click='changeGame'>Button</button> </div> </div> </body> <script type="text/javascript"> new Vue({ el:'#app', data: { gameOn:true, penalty:false, }, watch:{ gameOn(value){ alert(this.penalty); } }, methods:{ changeGame(){ this.gameOn = false; } } }); </script> </html>
Check Guide here