<template>
<div class="ticket-content">
<div class="ticket-content-left">
<h1>{{title}}</h1>
<h3>{{limit}}</h3>
<h3 style="color: -sharp999;">{{condition}}</h3>
</div>
<div class="ticket-content-right" :class="{available : available}" @click="getTicket">
<span>{{available ? "":""}}</span>
<div class="ticket-content-right-border" :class="{borderAvailable : available}"></div>
</div>
</div>
</template>
<script>
export default {
props:{
title:String,
limit:String,
condition:String,
available:Boolean
},
data(){
return {
}
},
methods: {
getTicket(){
this.available = false;
}
}
}
</script>
what should I do if I want to manipulate the value of available?