Deaktivierte JS-Funktionen beeinträchtigen den normalen Betrieb von HTML/JS/Babel-Code
<p>Im folgenden Code habe ich erwartet (Konsole protokolliert), dass das Objekt <code>props</code> nur das Mitglied <code>className</code> enthielt, aber es enthielt das Mitglied: <p> ;code>{ Klassenname, ID, Ticket, Anfrage }</code>. Wenn ich jedoch den Parameter <code>...others</code> aus <strong>Unused Function</strong><code>NullComp</code> entferne, dann ist das Objekt <code>props< Das einzige Mitglied von ;/code> ist: <code>className</code>, was genau das ist, was ich ursprünglich erwartet hatte. </p>
<p>Sie können es selbst ausprobieren, indem Sie den folgenden Code ausführen: </p>
<p>Verwenden: <code>...andere</code>: </p>
<p><br /></p>
<pre class="brush:html;toolbar:false;"><!DOCTYPE html>
<html>
<Kopf>
<meta charset="UTF-8" />
<title>Test</title>
<script src="https://unpkg.com/react/umd/react.produktion.min.js"></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.produktion.min.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head>
<Körper>
<div id="root"></div>
<script type="text/babel">
Funktion GoalComp({
AUSWEIS,
Fahrkarte,
Anfrage,
...Requisiten
}) {
console.log(props);
return <div>Independent Retriever</div>;
}
</script>
<script type="text/babel">
function NullComp({ timeRanges, ...others }) {
null zurückgeben;
}
</script>
<script type="text/babel">
const { useState, useEffect } = React;
const App = () => {
zurückkehren (
<GoalComp
className="mt-10"
id="1"
Ticket="IT-ABCD"
request="Frieden und Liebe"
/>
);
};
ReactDOM.render(<App />, document.querySelector("#root"));
</script>
</body>
</html></pre>
<p><br /></p>
<p>不使用:<code>...others</code>:</p>
<p><br /></p>
<pre class="brush:html;toolbar:false;"><!DOCTYPE html>
<html>
<Kopf>
<meta charset="UTF-8" />
<title>Test</title>
<script src="https://unpkg.com/react/umd/react.produktion.min.js"></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.produktion.min.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head>
<Körper>
<div id="root"></div>
<script type="text/babel">
Funktion GoalComp({
Ausweis,
Fahrkarte,
Anfrage,
...Requisiten
}) {
console.log(props);
return <div>Independent Retriever</div>;
}
</script>
<script type="text/babel">
Funktion NullComp({ timeRanges }) {
null zurückgeben;
}
</script>
<script type="text/babel">
const { useState, useEffect } = React;
const App = () => {
zurückkehren (
<GoalComp
className="mt-10"
id="1"
Ticket="IT-ABCD"
request="Frieden und Liebe"
/>
);
};
ReactDOM.render(<App />, document.querySelector("#root"));
</script>
</body>
</html></pre>
<p><br /></p>
<p>我在这里漏掉了什么?</p>
<p>谢谢!</p>