Home > Back-end >  how to insert vuejs variable in window.open event
how to insert vuejs variable in window.open event

Time:04-19

Here in my code

<tr v-for="person, index in People" :key='index'>
<td>
<button type="button" onclick="window.open('/details/' person.id,'_blank')">
details</button>
</td></tr>`

'People' is a json data defined in the script. how can i use 'person.id' variable defined by the v-for function to create the url for new window?

CodePudding user response:

I hope the following is useful for you.

HTML

<div v-for="person, index in people" :key="index">
   <button v-on:click="onButtonClick(person.id)">Detail</button>
</div>

JS

new Vue({
    data: {
        people: [{ id: 0 }, { id: 1 }, { id: 2 }]
    },
    methods: {
        onButtonClick: function (id) {
            window.open(`/details/${id}`, '_blank')
        }
    }
});
  • Related