有人可以向我解释为什么我不能在 nextjs13 的子组件中使用 useState

Question

NextJS 的新更新发布了（带有应用程序路由器）。我真的对客户端/服务器端组件关系感到困惑。我目前正在试验它，它在文档中说：

“使用客户端”位于仅服务器代码和客户端代码之间。它被放置在 文件顶部，导入上方，定义它所在的截止点 从仅服务器部分跨越边界到客户端部分。一次 “使用客户端”在一个文件中定义，所有其他模块都导入其中， 包括子组件，被认为是客户端包的一部分。

现在，这是我的代码（Child.tsx）：

import Parent from "./Parent";
import React, { useState } from 'react';

export default function Child() {
    const [s, ss] = useState(null);

    return (
        <div>child</div>
    )
}

Parent.tsx:

'use client';
import React, { useState } from 'react'

export default function Parent({children} : {
    children: React.ReactNode
}) {
    const [s, ss] = useState(null);

    return (
        <div>{children}</div>
    )
}

page.tsx:

import Child from "./Child";
import Parent from "./Parent";

export default function Page() {

  return (
    <>
      <Parent>
        <Child />
      </Parent>
    </>
  )
}

由于我的父组件有“使用客户端”指令，根据文档，所有子组件也必须标记为客户端组件：

./app\Child.tsx

ReactServerComponents错误：

你正在导入一个 需要useState的组件。它仅适用于客户端组件，但 它的父母都没有标有“使用客户端”，所以他们是服务器 默认情况下的组件。

这个问题的原因是什么？