如何在能够访问 params.id 以呈现表单组件并能够执行更新和删除请求的同时声明客户端组件？

Question

我正在使用 Next JS 13 框架构建一个待办事项应用程序。我将 Pocketbase 用作数据库即服务，并设法设置创建和读取功能设置。但是，对于更新和删除，我在设置时遇到了一些困难，因为该组件具有表单元素，它使用先前从父组件接收到的 params.id 进行渲染。

我尝试做完全基于服务器的渲染，但表单无法工作，因为我必须使用 POST 方法在表单元素上设置 action={"http://127.0.0.1:8090/api/collections/todos/records/" + params.id} 以更新现有的待办事项数据。因此，我需要将此组件渲染为客户端组件。但现在的主要问题是，根据上面的主题，每当我添加 "use client"; 以将其声明为客户端组件时，我都会在那里收到错误消息状态。我哪里做错了？我怎样才能将其声明为客户端组件，同时能够访问服务器组件的 params.id 以呈现和形成组件作为客户端组件？

下面是 Update.js 的组件；

"use client";
import PocketBase from "pocketbase";

import Input from "@/components/Input/Input";
import Button from "@/components/Button/Button";

const getTodoItem = async (id) => {
  const pb = new PocketBase("http://127.0.0.1:8090");

  const record = await pb.collection("todos").getOne(id, {
    expand: "relField1,relField2.subRelField",
  });

  return record;
};

const EditToDo = async ({ params }) => {
  const todoItem = await getTodoItem(params.id);

  return (
    <>
      <Card>
          <h1>
            Edit Task: {todoItem.title}
          </h1>
          <form
            action={
              "http://127.0.0.1:8090/api/collections/todos/records/" + params.id
            }
            method="POST"
          >
            <Input
              type="text"
              inputType="input"
              name="title"
              placeholder={todoItem.title}
            />
            <Input
              type="text"
              inputType="textarea"
              placeholder={todoItem.description}
              name="description"
            />
            <Button className={styles.button} buttonType="button" type="submit">
              <Svg
                className="me-2"
                viewBox="0 0 448 512"
                d="M471.6 21.7c-21.9-21.9-57.3-21.9-79.2 0L362.3 51.7l97.9 97.9 30.1-30.1c21.9-21.9 21.9-57.3 0-79.2L471.6 21.7zm-299.2 220c-6.1 6.1-10.8 13.6-13.5 21.9l-29.6 88.8c-2.9 8.6-.6 18.1 5.8 24.6s15.9 8.7 24.6 5.8l88.8-29.6c8.2-2.8 15.7-7.4 21.9-13.5L437.7 172.3 339.7 74.3 172.4 241.7zM96 64C43 64 0 107 0 160V416c0 53 43 96 96 96H352c53 0 96-43 96-96V320c0-17.7-14.3-32-32-32s-32 14.3-32 32v96c0 17.7-14.3 32-32 32H96c-17.7 0-32-14.3-32-32V160c0-17.7 14.3-32 32-32h96c17.7 0 32-14.3 32-32s-14.3-32-32-32H96z"
              />
              Update
            </Button>
          </form>
        </Card>
    </>
  );
};

export default EditToDo;

错误信息如下；