vuejs multiple v-if on one element

sup, so I have a problem with v-if in vue.

basicly I have a v-for that loops thru array and inside that v-for I have a couple of elements with v-if

<button v-if="Collection.status" type="button">deactivate</button>
<button v-else type="button">activate</button>

but I would also like to disable “activate” buttons if a data variable (disableButton) is true. How could I do that?

Its maybe a silly question but im new to vue and i have been searching for this for to long.


Try like following snippet:

new Vue({
  el: '#demo',
  data() {
    return {
      Collections: [{id: 1, status: true}, {id: 2, status: false}, {id: 3, status: true}],
      disableButton: true

Vue.config.productionTip = false
Vue.config.devtools = false
<script src=""></script>
<div id="demo">
    <li v-for="Collection in Collections" :key="">
      <button v-if="Collection.status" type="button" >deactivate</button>
      <button v-else :disabled="disableButton" type="button">activate</button>