Question

我使用renderRightButton api将rightButton插入react-native-router-flux。我遇到的问题是rightButton需要访问组件中的方法。

class App extends React.Component {
  render() {
    return(
      <Router>
          <Scene
              key="firstScene"
              component={FirstScene}
              title="First scene"
              rightTitle="Apply"
              renderRightButton={this.getRightButton}
          />
      </Router>
    )
  }

  getRightButton() {
    return(

      // someMethodOnFirstSceneComponent lives on the FirstScene component

      <View onPress{this.someMethodOnFirstSceneComponent}>
        <Text>
          Invoke Function from Scene Component
        </Text>
      </View>
    )
  }
};

一种选择是将当前处于FirstScene状态的所有数据放入redux reducer中，然后将someMethodOnFirstSceneComponent放在FirstScene组件上。但是，我试图将状态保持在组件中而不是依赖于reducers，因为根据我的经验，它可以让事情更容易理解。

Answer 1

我找到了一种方法。不是一个很好的解决方案，但它的工作原理。我在组件构造函数

中设置了onRight方法

  constructor(props) {
    super(props);
    this.props.component.onRight = () => {
      console.warn("call from my onRight function")}
    }
  }

react-native-router-flux：Navbar按钮需要访问场景组件方法

1 个答案: