I can’t figure it out how to pass params to an anonymous function in Nuxt 3.
index.vue:
JavaScript
x
23
23
1
<template>
2
<form @submit.prevent="signUpNewsletter()">
3
<input type="email" placeholder="example@x.com" v-model="userEmail">
4
<input type="submit" value="Submit">
5
</form>
6
</template>
7
8
<script setup>
9
const userEmail = ref('x@x.de')
10
11
function signUpNewsletter () {
12
useAsyncData(
13
'newsletter',
14
() => $fetch('/api/sign_up_news', {
15
method: 'POST', // Post method works
16
body: {
17
email: userEmail.value
18
}
19
})
20
)
21
}
22
</script>
23
server/api/sign_up_news.js:
JavaScript
1
13
13
1
import { createClient } from '@supabase/supabase-js'
2
3
export default async (email) => { // can't read the parameter
4
const SUPABASE_KEY = 'key123'
5
const SUPABASE_URL = 'url.supabase.co'
6
const supabase = createClient(SUPABASE_URL, SUPABASE_KEY)
7
8
const { data, error } = await supabase
9
.from('newsletter')
10
.insert([{ email }]) // <<< Fails!
11
return data
12
};
13
working:
JavaScript
1
13
13
1
import { createClient } from '@supabase/supabase-js'
2
3
export default async () => {
4
const SUPABASE_KEY = 'key123'
5
const SUPABASE_URL = 'url.supabase.co'
6
const supabase = createClient(SUPABASE_URL, SUPABASE_KEY)
7
8
const { data, error } = await supabase
9
.from('newsletter')
10
.insert([{ email: 'hi@it.works' }]) // <<< Works!
11
return data
12
};
13
Do you know how to pass parameter into Nuxt 3 server/api? Or do you got a source? The official docs are blank at this moment.
Advertisement
Answer
Use useBody
Its mention in the docs: https://v3.nuxtjs.org/guide/features/server-routes#handling-requests-with-body
you just need to read through
JavaScript
1
15
15
1
import { createClient } from '@supabase/supabase-js'
2
3
export default async (event) => { // can't read the parameter
4
5
const body = await useBody(event)
6
const SUPABASE_KEY = 'key123'
7
const SUPABASE_URL = 'url.supabase.co'
8
const supabase = createClient(SUPABASE_URL, SUPABASE_KEY)
9
10
const { data, error } = await supabase
11
.from('newsletter')
12
.insert([{ email: body.email }])
13
return data
14
};
15