Reactjs React native（vs.React）中的不变性和组件道具

这个问题有点与我有关

这听起来像是一个愚蠢的问题，已经被回答了一百万次，但我无法从我迄今为止读到的东西中找出什么是真的，什么不是。我在react或react本机文档中都找不到有关此主题的详细信息

那么，有人知道在react native中如何处理道具（在引擎盖下）吗？我问这个问题是因为我在几个地方读过：

道具是不变的

组件本身是不可变的

道具/组件不是不可变的，但更改它们对渲染没有影响

我还认为react-native处理道具的方式与react完全相同（即react-native直接使用react，因此它们的行为方式相同）

我想检查这三个陈述中哪一个是正确的，所以我试着一个接一个地打破它们，看看哪一个是正确的。我将在这里描述的所有测试用例都是在中实现的

道具是不变的吗？

让我们考虑这个简单的例子：

const style = {height: 10, width: 10, backgroundColor: "red"};
const firstItem = <View style={style} />;
firstItem.props.style = {...style, height: 100};
console.log(firstItem.props.style.height);

同样，如果

secondItem

是不可变的，但它会打印

200

，那么它应该打印

10

。因此，组件在react native中不是不可变的

更改道具对渲染没有影响？ 这次我不需要修改代码，我只需要渲染这两个项目，看看它们是高矩形还是小正方形。正如您可能已经猜到的，这会渲染两个高矩形，这意味着更改变异的组件/道具确实会对组件的渲染产生影响

export default class App extends React.PureComponent {
  render() {
    return (
      <View style={{ margin: 20, padding: 20, flexDirection: "row" }}>
        {firstItem}
        {secondItem}
      </View>
    );
  }
}

而不是（例如）改变组件：

child.props = {...child.props, doSomething: this.doSomething }

React.cloneElement(child, { doSomething: this.doSomething })

child.props = {...child.props, doSomething: this.doSomething }