Vue.js v-for Index

Question

Just new to use Vue.js and I have a question:

I have a array to build a table. If I double click the table row, the program will call a javascript function to get the selected item by its index.

<div id="vm-table">
    <table>
        <tr v-for="(item, index) in items" ondblclick="getItem('{{ index }}')">
            <td>{{ index }}</td>
            <td>{{ item.pk }}</td>
            <td>{{ item.description }}</td>
        </tr>
    </table>
</div>
<script>
    var vm = new Vue({
        el: "#vm-table",
        data: {
            items: []
        }
    });
</script>

I assume the array "items" already contains a list of items. In the above "tr" line it seems cannot get the "index" value and the value must be used in the inner "td" elements. If I need to get the parameter of index how can I do?

Thanks,

instead of ondblclick="getItem('{{ index }}')" try @dblclick="getItem(index)" — Jhecht
– Jhecht, Commented Sep 20, 2019 at 2:57

Drown · Accepted Answer · 2019-09-20 03:00:00Z

1

Try this instead :

    <tr v-for="(item, index) in items" @dblclick="getItem(index)">
        <td>{{ index }}</td>
        <td>{{ item.pk }}</td>
        <td>{{ item.description }}</td>
    </tr>

edited Sep 20, 2019 at 3:00

answered Sep 20, 2019 at 2:54

Drown

5,9921 gold badge32 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue.js v-for Index

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related