T
TanStack•6mo ago
frail-apricot

Proper way of passing useForm to child

I am getting the error 
(destructured parameter) is undefined
(destructured parameter) is undefined
Sentry says it comes from the const formValues = props.form.useStore(state => state.values) Can you spot what I am droing wrong? It works locally, but in production it fails: 
<script setup lang="ts">
import type { LeadForm } from './index.vue'

type Props = {
  form: LeadForm
}

const props = defineProps<Props>()
const { form } = props // EDIT - this fixed it

const formValues = form.useStore(state => state.values)
</script>
<script setup lang="ts">
import type { LeadForm } from './index.vue'

type Props = {
  form: LeadForm
}

const props = defineProps<Props>()
const { form } = props // EDIT - this fixed it

const formValues = form.useStore(state => state.values)
</script>
3 Replies
frail-apricot
frail-apricotOP•6mo ago
Adding in const { form } = props fixed this.
fair-rose
fair-rose•6mo ago
could you elaborate on how you added it in? in case someone sees this post in the future
frail-apricot
frail-apricotOP•6mo ago
Sure thing. It was caused by lost reactivity when passing the prop.

Did you find this page helpful?