提问人:Jay0813 提问时间:9/13/2023 更新时间:9/13/2023 访问量:37
使用 sveltekit 时如何处理服务器端的更新逻辑?
How to handle update logic in server side when using sveltekit?
问:
我正在使用 sveltekit。 我想要的是更新输入数据。 更新本身很简单,但是有一个问题,那就是我需要在标头中发送一个accessToken来立即发送更新API请求。 但是,此令牌当前包含在作为 httpOnly:true 处理的 cookie 中。 所以我无法将该 cookie 导入 JavaScript,所以我认为我需要在服务器端处理更新逻辑。
我试图通过服务器端的动作功能来解决它,但我遇到了以下问题。
- 当我按下校正按钮时,我写的输入数据正在初始化。
- 不知道是不是因为输入值的初始化,但是动作函数没有得到我输入的值。
下面是我写的代码。
// +page.svelte
<form action="?/updateUser" method="post" use:enhance>
<div class="mb-6">
<Label for="email-input" class="block mb-2">email</Label>
<div class="flex gap-4 w-full">
<Input id="email-input" size="lg" placeholder="email" bind:value={_email} />
<Button type="submit" class="w-fit whitespace-nowrap text-sm" disabled={!isEmailChanged}
>Edit</Button
>
</div>
</div>
</form>
// +page.server.ts
export const actions: Actions = {
updateUser: async ({ cookies, request }) => {
const data = await request.formData();
const email = data.get('email-input') as string;
console.log({ email });
// throw redirect(303, '/protected?page=1');
}
};
欢迎任何建议。谢谢
答:
2赞
H.B.
9/13/2023
#1
我不明白你第一点的意思,但数据可能没有被发送,因为表单数据要求输入具有属性,是无关紧要的。因此,除非组件在内部设置它,否则不会发送任何内容。name
id
Input
评论
0赞
Jay0813
9/13/2023
谢谢你的回答。添加 name 属性后,将发送数据。但是,如果我单击该按钮,则输入数据在输入文件中为空。这是由表单提交默认操作引起的吗?这似乎是刷新
1赞
H.B.
9/13/2023
enhance
将在提交时重置表单并使 无效 ,如果您有一个返回当前电子邮件地址的函数并将其传递给输入(例如),则该值在提交后应该是正确的。还可以从操作中返回一个对象,该对象将传递给属性。一个常见的模式是 。请参阅表单操作文档,那里有很多详细信息。data
load
value={data.email}
form
value={form?.email ?? ''}
0赞
Jay0813
9/13/2023
非常感谢您的帮助。我必须仔细阅读文件祝你有美好的一天!
评论