Go back, modify the DOM after it renders

Vue.component('list-din',{
  template:'<div>
  <b-button v-on:click="agrega">Agregar</b-button>
    <b-list-group >
      <b-list-group-item v-for="(renglon, index) in this.renglones" v-bind:key="renglon.id"
      v-bind:title="renglon.opcion"
      v-on:remove="renglones.splice(index,1)" class="d-flex justify-content-between align-items-center"><tinymce-estatico>{{renglon.opcion}}</tinymce-estatico>
      <b-badge variant="primary" pill>{{renglon.calificacion}}</b-badge>
      </b-list-group-item>
    </b-list-group>
  </div>
  ',
  data() {
    return{ renglones: [{calificacion:1,
      opcion: 'texto',
      id: this.nextID,
      }

    ],
    nextID : 0,
  };
  },
  methods:{
    llama(){
      Event.fire('trae-opcion');},
    agrega(opcion){
      this.renglones.push({calificacion:1,opcion: opcion,id:this.nextID});
      this.nextID+=1;
    }
  },
  created:function(){
    Event.listen('recive-opcion',function(opcion){
      this.agrega(opcion);
      console.log('chido');      
    });
  } ,
});