console
var app= new Vue({
el:"#app",
data:{
imgSrc:"data:image/jpeg;base64,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",
imgTitle:"flower",
isActive:false
},
methods:{
toggleActive:function(){
this.isActive = !this.isActive;
}
}
})
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js">
</script>
<div id="app">
<img :src="imgSrc" :title="imgTitle" :class="{active:isActive}" @click="toggleActive">
</div>
.active{
border:1px solid red;
}