簡體   English   中英

React Native錯誤:undefined不是對象(評估'_this2.props.navigator.push')

[英]React Native error: undefined is not an object (evaluating '_this2.props.navigator.push')

因此,基本上我在與導航器相關的標題中出現錯誤。 當我按圖標時,錯誤彈出。

我基本上想要做的是在頂部制作一個標簽欄,以在三種不同的視圖之間切換:提要,Wiki和留言板

這是我的index.android.js :(導入Nav)

_renderScene(route, navigator) {
    var globalNavigatorProps = {navigator};

    switch(route.ident) {
        case "FeedView":
            return(
                <Feed
                 {...globalNavigatorProps}
                />
            );

        case "WikiView":
            return(
                <View>
                    <Text>
                        {'Hello'};
                    </Text>
                </View>
            );

        case "BoardView":
            return(
                <View>
                    <Text>
                        {'Hello'};
                    </Text>
                </View>
            );

        default:
            console.log(`Something went wrong ${route}`);
    }
}

render(){
    return(
        <View>
            <Nav />
            <Navigator
                initialRoute={{ident:"Feed"}}
                ref="appNavigator"
                renderScene={ this._renderScene }
            />

        </View>
    );
}

這是我的Nav.js:

constructor(props){
    super(props);
}

render(){

    console.log(this.props.navigator);
    return(
        <View style={{flexDirection: "column"}}>
            <View style={styles.nav}>
                <Icon onPress={(event) => this.props.navigator.push({ident: "Feed"})} name="newspaper-o" size={22}/>
                <Icon name="wikipedia-w" size={22}/>
                <Icon name="comments" size={22}/>
            </View>
            <View style={styles.divider}/>
        </View>
    );
}

_changeView(type){

}

我不認為這是問題,但是renderScene函數不會綁定到react組件。

嘗試將renderScene={ this._renderScene }轉換為renderScene={ this._renderScene.bind(this) }

當您沒有綁定(this)時,總是會發生此錯誤,請檢查Icon模塊的onPress方法

如果您嘗試實現選項卡式視圖,則有更好的方法可以執行,您可以始終使用開源模塊,例如https://github.com/skv-headless/react-native-scrollable-tab-view開發人員以易於使用的方式制作了該示例,並且該示例足以應付大部分內容。

因此,我建議不要使用自己創建此類組件的方式,而是使用社區制作的模塊。

希望我的回答對您有所幫助。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM