1

tenho rodando um comando simples de "for" com Vue.js. Quero apresentar em "console.log" qual foi o valor clicado.

Cheguei no resultado de apresentar em console.log um valor estático do array, mas preciso do valor exato do clique.

let app = new Vue({
  el: '#app',
    data: {
      charges:
        [
            { title: 'Título 1' },
            { title: 'Título 2' }
        ]
    },
    methods: {
      modalContent(){
        console.log(this.charges.title = this.charges[0].title);
      }
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
    <div v-for="item in charges">
        <button @click="(modalContent())"> {{ item.title }} </button>
    </div>
</div>

1 Resposta 1

0

Como precisa pegar o índice dessa lista (que na maioria das vezes não é a melhor opção, o correto é que cada linha tenha um identificador próprio e natural), no v-for também escreve o no código que deseja, pegar o item e também o seu indice na lista que no caso é (item, index) e também no método modalContent(index) passe também esse index que é a posição dado no array charges. No seu código da pergunta se fez errado não pode atribuir daquela forma então eu simplifiquei para entender o que ele está agora com a posição está trazendo o valor contido na lista, exemplo:

Vue.config.devtools = false;
Vue.config.productionTip = false;
let app = new Vue({
    el: '#app',
    template: `<div id="app">
    <div v-for="(item, index) in charges">
        <button @click="(modalContent(index))"> {{ item.title }} </button>
    </div>
</div>`,
    data: {
      charges:
        [
            { title: 'Título 1' },
            { title: 'Título 2' }
        ]
    },
    methods: {
      modalContent(index){
        const title = this.charges[index].title;
        console.log(title);
      }
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app"></div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .