Computed v-for Vuejs

1

I have a v-for

<div  v-for="(m, ind) in arrayMeses" :key="ind" v-if="m" class="mes">
    <table border="1" width="100%">
        <tbody> 
            <tr class="mes_title">
                <td colspan="7" class="mes_title font-14"> 
                    {{ m }} - {{ testeComputed(ind) }}
                </td>
            </tr>
        </tboddy>
    </table>

I want to execute a method on each interaction When the data is changed run

I've tried

 computed: {
     testeComputed: function(ind) {
         console.log('m',ind)
         return 'teste' + ind
     },
 },

You are returning an object with all elements of the page I would like to receive the index or the name of the month

    
asked by anonymous 22.09.2018 / 17:49

1 answer

1

You are using computed properties in the wrong way. Think of computed as a read-only property.

See the example below:

<div id="exemplo">
  Mensagem ao contrário: {{ mensagem.split('').reverse().join('') }}
</div>

To remove the "raw" logic from the template, use a computed property.

  

Expressions inside templates are very convenient, but are meant for simple operations. Putting too much logic in them can make them swollen and make their maintenance more complicated. ( "Computed Data and Observers", from the documentation )

The result:

<div id="exemplo">
  <p>Mensagem ao contrário: {{ mensagemAoContrario }}</p>
</div>

var vm = new Vue({
  el: '#example',
  data: {
    message: 'Olá Vue'
  },
  computed: {
    mensagemAoContrario: function () {
      return mensagem.split('').reverse().join('');
    }
  }
})

If you really want to parameterize this, you can use a field in data or a method itself, in methods .

    
23.09.2018 / 02:09