Pass prop as parameter to method in Vue

Viewed 789

I have a Vue component and I pass props into it:

export default {
    props: [
        "notificationDate",
        "notificationType",
        "notificationMessage",
        "downLoadLink",
        "inProgress",
        "downloadImage",
        "count",
        "name"
    ],
}

In my template, i use these props:

 <div class="notification">
    <span class="time">{{notificationDate}}</span>
    <p><b>{{notificationType}}:</b> {{notificationMessage}}</p>       

For one prop, "count", I want to pass it to a method in the click event of a button. I tried this:

  <b-button type="is-danger" size="is-small"
            icon-right="delete" @click="deleteNotification(count)")">
    Remove
  </b-button>

But in my method, count is undefined:

      methods: {
        deleteNotification(count) {
          //count is undefined
        }}

How do I pass my prop into my @click method? Thanks

1 Answers

You can pass it like this:

<b-button 
    type="is-danger" 
    size="is-small"
    icon-right="delete"
    @click="deleteNotification(count)"
>
    Remove
</b-button>
Related