Question

我有一些简单的问题：

是否可以修改React Native组件中的prop（非状态）（而不是来自父组件）？
在[1]之后，如果我想修改同一组件中的道具，我该如何实现呢（或者如果[1]中的答案为否，则解决方法）？
如果我有以下内容：

//父

render(){
  return <View><ChildComponent propA={this.state.propA} /></View>
}

triggerChangeInParent(val) {
  this.setState({
    propA: val
  });
}

// Child（ChildComponent）

render() {
  return <View><Text>{this.props.propA}</Text></View>
}

triggerChangeInChild(val) {
  //To set props.propA here
}

允许父组件和子组件修改“propA”。触发最新版本的人将其值优先于修改“propA”（例如，如果在“triggerChangeInParent”之后触发“triggerChangeInChild”，则“triggerChangeInChild”中的“val”将用于“propA”。

我的问题是，我们如何实现这一目标（解决这个问题的可能解决方案/替代方案）？什么是最佳实践/模式？

谢谢！

Answer 1

状态是可变的，道具是不可变的，因此您无法修改组件中的道具。请在当前组件之外进行。如果您使用的是redux，则可以使用reducer。

您应该仅修改父级的propA，请在父级中编写方法，然后通过prop将其传递给子级。所以你可以从孩子那里调用这个方法，这意味着你在孩子里面做了改变。

父

contractor(props){

   super(props)
   this.modifyPropsOnParent =  this.modifyPropsOnParent.bind(this)
}
modifyPropsOnParent(){

   // do your change here
}

render() {
   return <Child modifyPropsOnParent={this.modifyPropsOnParent} otherProp={yourProps} />
}

Child可以通过this.props调用父方法。 modifyPropsOnParent（）

React Native - 修改同一组件中的prop

1 个答案: