I'm trying to start using Tanstack and am having problems passing variables into mutation functions.

In the following, "newTodo" is returning undefined.

<script setup>
  import axios from "axios";
  import {
    useMutation
  } from '@tanstack/vue-query'
  const {
    isPending,
    isError,
    error,
    isSuccess,
    mutate
  } = useMutation({
    mutationFn: (newTodo) => {
      console.log(newTodo)
    },
  })

  function addTodo() {
    mutate({
      id: new Date(),
      title: 'Do Laundry'
    });
  }
</script>
<template>
  <span v-if="isPending">Adding todo...</span>
  <span v-else-if="isError">An error occurred: {{ error.message }}</span>
  <span v-else-if="isSuccess">Todo added!</span>
  <button @click="addTodo">Create Todo</button>
</template>

I copied this directly from their documentation, other than the newTodo that I'm console logging to make my point. I have the latest Vue and the latest tanstack.

Others indicate this works fine for them.

"@tanstack/vue-query": "^5.71.5",
"axios": "^1.7.9",
"pinia": "^2.1.7",
"pusher-js": "^8.4.0-rc2",
"vue": "^3.4.21",

Seems like it must have something to do w/ a configuration but there's no config needed for tanstack other than adding it to the app, which I've done.

No idea why they won't pass through.