react-native - v2 Navigation.showModal 创建新的组件实例但实际上并没有导航到它

Question

我正在尝试使用 react-native-navigation v2(版本 2.8.0)执行最简单的 showModal 动画，但我无法让新屏幕弹出旧屏幕。新组件在其 componentDidMount 函数中命中了一个日志，但没有进行导航。

我已经尝试从所有教程和文档中复制和粘贴“工作”代码。

// I Registered the component
Navigation.registerComponent('Test', () => TestView)

// I set the root (and it appears as expected)
Navigation.setRoot({
    root: {
      stack: {
        children: [{
          component: {
            name: 'Test'
          }
        }]
      }
    }
  })


// Here is the Component I'm trying to call `showModal` from
export default class TestView extends React.Component<any, any> {

  constructor(props) {
    super(props)
    Navigation.events().bindComponent(this)
  }

  public componentDidMount() {
    console.log('***MOUNT***')
  }

  public render() {
    return (
      <TouchableOpacity style={ { flex: 1 } } onPress={ this.navigate }>
        <View style={{ flex: 1, backgroundColor: '#c3c3c3' }} />
      </TouchableOpacity>
    )
  }

  private navigate = () => {
    Navigation.showModal({
      component: {
        name: 'Test',
        options: {
          modalPresentationStyle: OptionsModalPresentationStyle.overFullScreen,
        }
      }
    })
  }

}```

When the navigate function is called, the log in `componentWillMount` hits (again) but nothing else happens and the root component remains on screen. I'm convinced I'm doing something stupid so hopefully a few more sets of eyes will help. Thanks.

Answer 1

我的问题是没有正确设置传入堆栈的 id。这是我当前使用的有效模式。

Navigation.showModal({
        stack: {
            id: screen,
            children: [{
                component: {
                    id: id,
                    name: screen,
                    passProps: props
                }
            }]
        }
    })