我见过两种在 React 中解构 props 的方法。
function MyComponent({name,age,height}){
// do stuff here
}
或者
function MyComponent(props){
const {name,age,height} = props
// do stuff here
}
假设这个组件被用作
<MyComponent name="bob" age={25} height = {175} haspets={false}/>
这是我的问题：
如果我使用第一种解构方式，是否意味着我将无法访问其他专业人士，在这种情况下 haspets
这两种方式的优缺点是什么？
您可以稍后通过 arguments object访问对象的其他属性，但正如链接中所指出的那样，应该首选其余参数。
<MyComponent name="bob" age={25} height = {175} surname="test" haspets={false} />
function MyComponent({ name, age, height, ...rest }){
// rest will be an object like { surname: 'test', haspets: false }
}
我能想到的差异之一，我认为最重要的是，在第二种情况下，当你破坏你的props对象时，你正在使用const声明。
这样，您就无法再更改 上的这些值MyComponent，而在第一种情况下，您可以轻松修改它们。
如果你从函数参数中解构你的 props，你以后将无法访问任何其他的props**，所以你的假设是正确的。就性能和其他优点/缺点而言，这些形式几乎相同。我碰巧喜欢这种方式，因为我喜欢尽可能少地在我的文件中添加额外的变量声明。对于需要大量props的功能来说，这可能会很痛苦。
**除非您使用扩展运算符并将它们存储在单独的变量中。