元素类型无效：预期字符串（内置的组件）

Question

我按照这个教程来了解如何NavigationExperimental与终极版结合：https://medium.com/@dabit3/react-native-navigator-experimental-part-3-adding-tabs-28a2c57356b6#.ltz8yp73p

可惜我不能获得通过它，因为我碰到下面错误。这涉及NavRootComponent，它是一个包装NavigationCardStack的容器。

你能帮我找到下面的代码错误吗？

// root.js 
import React, { Component } from 'react'; 
import { Provider } from 'react-redux'; 
import configureStore from './store/configureStore'; 
import NavRootContainer from './containers/NavRootContainer'; 
const store = configureStore(); 

export default class extends Component { 
    render() { 
    return (
     <Provider store={store}> 
     <NavRootContainer /> 
     </Provider> 
    ) 
    } 
}; 

整个工程：https://github.com/ppiechota/sdApp

// NavRootContainer.js 
import { connect } from 'react-redux'; 
import { push, pop } from '../actions/navActions'; 
import React from 'react'; 
import Home from '../components/Home'; 
import About from '../components/About'; 
import { NavigationExperimental } from 'react-native'; 
const { NavigationCardStack } = NavigationExperimental; 

const mapStateToProps = (state) => { 
    return { 
    navigation: state.navReducer 
    } 
} 

const mapDispatchToProps = (dispath) => { 
    return { 
    pushRoute: (route) => dispatch(push(route)), 
    popRoute:() => dispatch(pop()) 
    } 
} 

class NavRootContainer extends React.Component { 
    constructor(props) { 
    super(props); 
    } 

    _renderScene = (props) => { 
    const { route } = props.scene; 
    if (route.key === 'home') { 
    return <Home _handleNavigate={this._handleNavigate.bind(this)} /> 
    } 
    if (route.key === 'about') { 
    return <About _goBack={this._handleBackAction.bind(this)} /> 
    } 
    } 

    _handleBackAction =() => { 
    if (this.props.navigation.index === 0) { 
     return false; 
    } 
    this.props.popRoute() 
    return true; 
    } 

    _handleNavigate = (action) => { 
    switch (action && action.type) { 
     case 'push': 
     this.props.pushRoute(action.route); 
     return true; 
     case 'back': 
     case 'pop': 
     return this._handleBackAction(); 
     default: 
     return false; 
    } 
    } 

    render() { 
    return (
     <NavigationCardStack 
     direction='vertical' 
     navigationState={this.props.navigation} 
     onNavigate={this._handleNavigate} 
     renderScene={this._renderScene} 
     /> 
    ); 
    } 

} 

export default connect(mapStateToProps, mapDispatchToProps)(NavRootContainer); 

Answer 1

OK，我发现了错误。我应该在解构时使用CardStack，但实际上我不明白为什么，我认为NavigationCardStack是默认名称。

const { 
    CardStack: NavigationCardStack 
} = NavigationExperimental 

Answer 2

不会导入Home和About组件