Toggle class on only one element in VUE

I now tried this code :

<pre id="index1" v-bind:class="[isActive ? 'shown' : 'hidden']" @click="isActive = !isActive">
  {{item.proposalResponse.insertObjects[0]}}
</pre>

...

data() {
  return {
    isActive: false
  };

...
<style>
  .hidden{
    height: 40px;
    overflow: hidden;
    background-color: powderblue;
  }
  .shown {
    background-color: powderblue;
  }
</style>

The problem with this code is that it generates a lot of these element and all of them toggle at the same time.

I would like to have it so only the element i click will toggle.

I am new to both js and vue.js so please be kind :)