i try to render page with dynamic properties. my code

```
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="root">
  <div v-for="current in 2" :key="current">
    <p :style="currentObject.color">
      {{ current  }}
      {{ currentObject.text }}
    </p>
  </div>
</div>

```

script is

```
let vm = new Vue({
  el : "#root",
  created: function () {
  console.log(this.current)
  },
  data : {
    current : 0,
    arrs : [
      {
        color : "background-color: blue;",
        text : "Dabodee Dabodai"
      },
      {
        color : "background-color: red;",
        text : "Angry"
      },
      {
        color : "background-color: green;",
        text : "See it works!"
      }
    ]
  },
  computed : {
    currentObject : function() {
      return this.arrs[this.current];
    }
  }
});

```

i want to p tag with different color and container object text via currentObject but when render the page, computed act likes current is 0 always. output is blue and text from currentObject is "Dabodee Dabodai"

what am i doing wrong?