<p>在下面的代码中，我期望（控制台记录）的对象<code>props</code>只包含成员：<code>className</code>，但它包含了成员：<code>{ className, id, ticket, request }</code>。然而，如果我从<strong>未使用的函数</strong><code>NullComp</code>中删除参数<code>...others</code>，那么对象<code>props</code>的唯一成员就是：<code>className</code>，这正是我最初期望的。</p>
<p>您可以通过运行下面的代码来自己尝试：</p>
<p>使用：<code>...others</code>：</p>
<p><br /></p>
<pre class="brush:html;toolbar:false;"><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Test</title>
<script src="https://unpkg.com/react/umd/react.production.min.js"></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
function GoalComp({
id,
ticket,
request,
...props
}) {
console.log(props);
return <div>Independent Retriever</div>;
}
</脚本>
<脚本类型=“text/babel”>
函数 NullComp({ timeRanges, ...others }) {
返回空值；
}
</脚本>
<脚本类型=“text/babel”>
const { useState, useEffect } = React;
const App = () =>; {
返回 （
<目标比较
类名=“mt-10”
id=“1”
票证=“IT-ABCD”
请求=“和平与爱”
>>
）；
};
ReactDOM.render(
, document.querySelector("#root"));
</脚本>
</正文>
</html></pre>
<p><br />></p>
<p>不使用：<code>...其他</code>：</p>
<p><br />></p>
;
<头>
<元字符集=“UTF-8”/>
<标题>测试
<脚本 src="https://unpkg.com/react/umd/react.product.min.js"></script>
<脚本 src="https://unpkg.com/react-dom/umd/react-dom.production.min.js"></script>
;
</头>
<正文>
<脚本类型=“text/babel”>
函数 GoalComp({
ID，
票，
要求，
...道具
}) {
控制台.log(道具);
return 独立检索器
;
}
</脚本>
<脚本类型=“text/babel”>
函数 NullComp({ timeRanges }) {
返回空值；
}
</脚本>
<脚本类型=“text/babel”>
const { useState, useEffect } = React;
const App = () =>; {
返回 （
<目标比较
类名=“mt-10”
id=“1”
票证=“IT-ABCD”
请求=“和平与爱”
>>
）；
};
ReactDOM.render(, document.querySelector("#root"));
</脚本>
</正文>
</html></pre>
<p><br />></p>
<p>我在这里漏掉了什么？</p>
<p>谢谢！</p> 
您观察到的行为实际上是预期的，并且不受
NullComp函数中...others的存在或缺失的影响。需要注意的关键是，在提供的代码中没有使用或调用NullComp函数，因此它不会影响GoalComp函数的输出。让我们来分析一下发生了什么：
在
GoalComp函数中，您使用解构来提取props中的id、ticket和request属性。其余的属性（如果有）使用扩展运算符...props收集到props对象中。当您在
App组件中渲染GoalComp组件时，您传递了以下props：className="mt-10"id="1"ticket="IT-ABCD"request="Peace and Love"在这种情况下，当这些props传递给
GoalComp时，id、ticket和request属性被提取出来，剩下的className属性被收集到props对象中。这就是为什么当您console.log(props)时，您会看到一个只有一个属性的对象：{ className: "mt-10" }。NullComp函数中...others的存在与否在这个上下文中是无关紧要的。由于没有使用NullComp，它是否有...others都不会影响GoalComp函数的输出。总之，代码按预期工作。在任何情况下，
NullComp函数都不会影响GoalComp函数的输出。希望对您有所帮助！