NEXTJS 13 应用程序路由器 - 客户端组件中调用的服务器操作失败，未呈现 error.tsx

问：

使用应用程序路由器，我有一个反应服务器组件 （RSC） 页面。 在该 RSC 中，我有一个名为 MYFORM 的组件（这是一个客户端组件，用于呈现 formik 表单）。

在提交时，我触发了一个服务器操作，通过formik的onSubmit道具发布数据：

• 如果成功，服务器操作将重定向
• 如果不成功，服务器操作将引发错误

就像在 RSC 中发生错误一样，我希望将错误对象传递给最近的 error.tsx。

但是，当从客户端组件调用的服务器操作失败时，似乎不会呈现最近的 error.tsx。

为什么？

我看到它可以通过 useTransition 钩子来实现 - 就像这个线程中提到的 https://github.com/vercel/next.js/issues/42525

我尝试做这样的事情，但我不完全确定为什么？

应用/组件/MyForm

"use client"

export default function MyForm(){
        // some stuff here but not relevant to display

    return (
        <Formik
            initialValues={{ email: '' }}
            id="register"
            onSubmit={async (values) => {
                await myServerAction(values);
            }}
        >
            <Field type="email" name="email" placeholder="Email" />
            <button type="submit">Submit</button>
        </Formik>
    );
};

app/page.tsx

export default async function Page(props) {
    // This is serverWorld
        // If someFetch throws an error it will be passed to the nearest  error.js

    const { data } = someFetch(url);

    return (
        <div>
            <SomeCompenent data={data} /> {/* This SomeComponent not relevant */}
            
                        <MyForm />
        </div>
    );
}