2016-08-03 3 views
0

Я работаю над проектом react-native и обновлен от 0.26 до 0.30. NavigationExperimental получил значительное количество изменений, в частности, от имени (NavigationRoute, NavigationState, ...) и изменения по методу onNavigate за NavigationCardStack, который становится onNavigateBack.НавигацияЭкспериментальное свойство `onNavigateBack` не найдено

Я использую поток0.27.0, чтобы проверить мой код.

Итак, вот ошибка, которую я получаю от flow.

app/containers/MyContainer.js:99 
99:   <NavigationCardStack 
       ^props of React element `NavigationCardStack` 
67: type Props = NavigationSceneRendererProps & { 
               ^property `onNavigateBack`. Property not found in. See: node_modules/react-native/Libraries/CustomComponents/NavigationExperimental/NavigationHeader.js:67 
113:    {...props} 
         ^^^^^ spread of identifier `props` 

app/containers/MyContainer.js:112 
112:   <NavigationHeader 
       ^React element `NavigationHeader` 
67: type Props = NavigationSceneRendererProps & { 
               ^property `onNavigateBack`. Property not found in. See: node_modules/react-native/Libraries/CustomComponents/NavigationExperimental/NavigationHeader.js:67 
113:    {...props} 
         ^^^^^ spread of identifier `props` 

И вот код ошибки. this.props.onNavigateBack получает свое значение от метода connect от redux.

class MyContainer extends Component { 
    props: Props; 

    render() { 
     return (
      <NavigationCardStack 
       navigationState={this.props.navigationState} 
       onNavigateBack={this.props.onNavigateBack} 
       renderOverlay={props => this._renderNavigationHeader(props)} 
       renderScene={scene => (<View />)} 
       style={styles.container} 
      /> 
     ) 
    } 

    _renderNavigationHeader(props) { 
     return (
      <NavigationHeader 
       {...props} 
       style={styles.header} 
       textStyle={styles.title} 
       renderLeftComponent={props => (<View />)} 
       renderRightComponent={props => (<View />)} 
       renderTitleComponent={props => (<View />)} 
      /> 
     ) 
    } 
} 

Я попытался сделать код как можно короче, обратите внимание Props тип I объявил содержит onNavigateBack как () => void.

ответ

0

Хорошо, я понял. Я предположил, что renderOverlay передал onNavigateBack методу, который он задал, но, похоже, это не так. Не уверен в этом, но я думаю, что это было раньше, когда было еще onNavigate.

Таким образом, исправить можно напрямую обратиться к this.props.onNavigateBack вместо того, чтобы смотреть внутрь props через оператора распространения.

_renderNavigationHeader(props) { 
    return (
     <NavigationHeader 
      {…props} 
      onNavigateBack={this.props.onNavigateBack} 
      style={styles.header} 
      textStyle={styles.title} 
      renderLeftComponent={props => (<View />)} 
      renderRightComponent={props => (<View />)} 
      renderTitleComponent={props => (<View />)} 
     /> 
    ) 
} 
Смежные вопросы