I'm learning nuxt and the tutor has a function to add an item called `updateTodo` and attached it to a button as the follwoing

`script`

```js
<script setup>  
  const updateTodo = async (id) => {
    if (!input) return;

    await $fetch(`/api/todo/${id}`, { method: 'PUT' });
  };
</script>

```

`template`

```html
<template>
  <div class="container">
    <input type="text" placeholder="Add a new todo..." v-model="input" />
    <NButton @click="() => updateTodo(todo.id)">Add</NButton>
  </div>
</template>

```

I dont know why he didn't call it directly (eg. `@click="updateTodo(todo.id)`). I tried to do it and it worked. Is there a reason i dont know or it's just a preference?