您传递给的值用作状态变量useState的起始值。因此，当您的组件props更改时，它们不会影响您正在使用的状态变量。初始值将是发送到组件的第一个 props，之后只能使用该setPropHook函数进行修改。

所以，简而言之，使用 props 作为初始化器绝对是一种代码味道，useState因为阅读代码并没有正确传达实际发生的事情。

你看不到它，因为它在 React 应用程序应该如何分发它的状态方面没有多大意义。

如果 prop 值设置在树的更高位置，则不应将其用作组件内单独状态的一部分。使用 prop 值间接确定组件的状态是有意义的，如“如果 prop 是 this，则将状态设置为那个”，但不要直接将 prop 复制到初始值中。

换句话说，组件的内部状态（通过useState和useReducerHooks访问）应该由组件决定，而不是直接由父组件决定。

是的，这很糟糕。您正在做的是将props传递给状态，但许多人不鼓励这样做。

React 文档说“使用 props 生成状态通常会导致“真实数据来源”的重复，即真实数据在哪里。” . 危险在于，如果在没有刷新组件的情况下更改了 props，则新的 props 值将永远不会显示，因为 props 的 state 初始化仅在第一次创建组件时运行。

唯一的例外是使用 prop 作为内部控制状态的种子。经过几年的react开发，我从来没有遇到过这样的情况。

进一步阅读：
React 组件从 props 初始化状态（SO 问题）
React Anti-Patterns：Props in Initial State（medium.com 文章）
为什么在 React.js 中将 Props 设置为状态是亵渎（博客文章）

如果您正在尝试接收该功能组件的props，那么可以，但与您编写的完全不同。所以在父组件中你会有这样的东西：

const App = () => {
  const [resource, setResource] = useState("posts");

然后在 JSX 中有一个组件，如下所示：

const App = () => {
  const [resource, setResource] = useState("posts");

  return (
    <div>
      <div>
        <button onClick={() => setResource("posts")}>Posts</button>
        <button onClick={() => setResource("todos")}>Todos</button>
      </div>
      <ResourceList resource={resource} />
    </div>
  );
};

该ResourceList组件必须能够接收App组件传递给它的props。在基于类的组件中，你会这样做{this.props.resource}，但在我们的例子中，它是一个使用 React 钩子的函数式组件，你想像这样编写它：

const ResourceList = (props) => {
  const [resources, setResources] = useState([]);

或者像这样通过 ES6 解构：

const ResourceList = ({ resource }) => {
  const [resources, setResources] = useState([]);