古い反応ネイティブコードを適応させてください。

Question

私は反応ネイティブでとても新しいです。私はreact-native-navigation-drawerモジュールでスライダメニューを作成しようとしていました。私はその証言に従っていた。あなたは、問題についての考えを持っているか、

import React from 'react'; 
import { StyleSheet, Text, View } from 'react-native'; 
import { Provider } from 'react-redux' 
import'../I18n/I18n.js'; 
import RootContainer from './RootContainer' 
import createStore from '../Redux' 

// create store 
const store = createStore() 

var SlideMenu = require('react-native-navigation-drawer'); 
var Menu = require('./menu.js'); 
var Pages = require('./pages.js'); 
var FirstPage = Pages.FirstPage; 
var SecondPage = Pages.SecondPage; 

export default class App extends React.Component { 
    getInitialState(fragmentId) { 
    return ({ route: 'firstpage' }); 
    } 

    updateFrontView() { 
    switch (this.state.route) { 
     case 'firstpage': 
     return <FirstPage />; 
     case 'secondpage': 
     return <SecondPage />; 
    } 
    } 

    routeFrontView(fragmentId) { 
    this.setState({ route: fragmentId }); 
    } 

    render() { 
    var fragment = this.updateFrontView(); 
    return (
     <View style={styles.container}> 
     <SlideMenu frontView={fragment} routeFrontView={this.routeFrontView} 
      menu={<Menu />} slideWay='left' moveFrontView={false} width={200}/> 
     </View> 
    ); 
    } 
} 

しかし、今、私はエラーを取得しています：

'use strict'; 

var React = require('react-native'); 
var { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View, 
} = React; 

var SlideMenu = require('react-native-navigation-drawer'); 
var Menu = require('./menu.js'); 

var Pages = require('./pages.js'); 
var FirstPage = Pages.FirstPage; 
var SecondPage = Pages.SecondPage; 
var ThirdPage = Pages.ThirdPage; 

var BasicExample = React.createClass({ 
    getInitialState(fragmentId) { 
    return ({ route: 'firstpage' }); 
    }, 

    updateFrontView() { 
    switch (this.state.route) { 
     case 'firstpage': 
     return <FirstPage />; 
     case 'secondpage': 
     return <SecondPage />; 
     case 'thirdpage': 
     this.refs.slideMenu.blockSlideMenu(true); 
     return <ThirdPage routeFrontView={this.routeFrontView}/>; 
    } 
    }, 

    routeFrontView(fragmentId) { 
    //we unblock slideMenu when we change the route (it will be activated 
    //when the page is updated, look at 'thirdpage') 
    this.refs.slideMenu.blockSlideMenu(false); 
    this.setState({ route: fragmentId }); 
    }, 

    render() { 
    var fragment = this.updateFrontView(); 
    return (
     <View style={styles.container}> 
     <SlideMenu ref="slideMenu" frontView={fragment} 
      routeFrontView={this.routeFrontView} menu={<Menu />} 
      slideWay='left' moveFrontView={false} width={200}/> 
     </View> 
    ); 
    } 
}); 

var styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    }, 
}); 

AppRegistry.registerComponent('BasicExample',() => BasicExample); 

私はこの1つにコードを更新することによって、それらを修正しようとした：私は自分のコードでエラーが発生しました？

[1]: https://github.com/ilansas/react-native-navigation-drawer/tree/master/examples/BasicExample 

Answer 1

あなたのページにデフォルト状態のルートを追加する必要があります。

import React from 'react'; 
import { StyleSheet, Text, View } from 'react-native'; 
import { Provider } from 'react-redux' 
import'../I18n/I18n.js'; 
import RootContainer from './RootContainer' 
import createStore from '../Redux' 

// create store 
const store = createStore() 

var SlideMenu = require('react-native-navigation-drawer'); 
var Menu = require('./menu.js'); 
var Pages = require('./pages.js'); 
var FirstPage = Pages.FirstPage; 
var SecondPage = Pages.SecondPage; 

export default class App extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     route: 'firstpage' 
    }; 
    } 

    getInitialState(fragmentId) { 
    return ({ route: 'firstpage' }); 
    } 

    updateFrontView() { 
    switch (this.state.route) { 
     case 'firstpage': 
     return <FirstPage />; 
     case 'secondpage': 
     return <SecondPage />; 
    } 
    } 

    routeFrontView(fragmentId) { 
    this.setState({ route: fragmentId }); 
    } 

    render() { 
    var fragment = this.updateFrontView(); 
    return (
     <View style={styles.container}> 
     <SlideMenu frontView={fragment} routeFrontView={this.routeFrontView} 
      menu={<Menu />} slideWay='left' moveFrontView={false} width={200}/> 
     </View> 
    ); 
    }