2017-03-07 54 views
-1

我打电话Trafik.js在索引页,但它不跑,我把错了,我不知道为什么......输出模块(元素类型无效预期字符串)

元素类型无效:预期字符串(用于内置组件)或类/函数(用于复合组件),但得到:object。检查dene1的渲染方法。

1- index.android.js

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View, 
    TouchableHighlight, 
    Navigator 
} from 'react-native'; 

import Trafik from './Trafik' 


var dene1 = React.createClass({ 

render : function(){ 

return <View style = {[style.container,this.border('red')]} > 

{this.header()} 

{this.middle()} 

{this.footer()} 

<Trafik/> 

     </View> 

}, //render 

header:function(){ 
return <View style = {[style.header,this.border('yellow')]}> 
<View style={[style.teklifBtn,this.border('blue')]}> 
<Text> 
Teklifler 
</Text> 
</View> 
    <View style={[style.mesajBtn,this.border('blue')]}> 
    <Text> 
Mesajlar 
</Text> 
</View> 

     </View>  

    }, 
middle:function(){ 
return <View style = {[style.middle,this.border('green')]}> 
<Text> 
middle 
</Text> 
     </View>  

}, 

footer:function(){ 
return <View style = {[style.footer,this.border('black')]}> 
<TouchableHighlight style={[style.kaskoBtn,this.border('blue')]}> 
<Text> 
kasko 
</Text> 
</TouchableHighlight> 
    <TouchableHighlight underlayColor='red' style={[style.trafikBtn,this.border('blue')]}> 
    <Text> 
trafik 
</Text> 
</TouchableHighlight> 
    <TouchableHighlight style={[style.yanginBtn,this.border('blue')]}> 
<Text> 
yangin 
</Text> 
</TouchableHighlight> 
    <TouchableHighlight style={[style.seyahatBtn,this.border('blue')]}> 
    <Text> 
seyahat 
</Text> 
</TouchableHighlight> 

     </View>  

}, 
border:function(color){ 
    return { 
    borderColor : color, 
    borderWidth: 4 
    } 
}, 


}) ;//dene1 

var style = StyleSheet.create({ 
container :{ 
     flex:1, 

    }, 
    header : { 
     flex :0.9, 
     flexDirection:'row', 


}, 
    middle : { 
     flex :3, 
     flexDirection:'row', 
     justifyContent:'center', 
     alignItems: 'center', 

    }, 
    footer:{ 

     flex :4, 
     flexDirection:'column', 


    }, 
     teklifBtn:{ 

     flex :1, 
     justifyContent:'center', 
     alignItems: 'center', 
     backgroundColor:'red' 

    }, 
     mesajBtn:{ 

     flex :1, 
     justifyContent:'center', 
     alignItems: 'center', 

    }, 
     kaskoBtn:{ 

     flex :1, 
     justifyContent:'center', 
     alignItems: 'center', 


    }, 
     trafikBtn:{ 

     flex :1, 
     justifyContent:'center', 
     alignItems: 'center', 

    }, 
     yanginBtn:{ 

     flex :1, 
     justifyContent:'center', 
     alignItems: 'center', 

    }, 
     seyahatBtn:{ 

     flex :1, 
     justifyContent:'center', 
     alignItems: 'center', 

    }, 



}) 

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

2.trafik.js

'use strict'; 

import React, { Component } from 'react'; 
import { 
    Text, 
    View 
} from 'react-native'; 


var Trafik = React.createClass({ 
render : function(){ 
return 
<Text> 
trafik sayfası 
</Text> 
} 
}) ;//dene1 

module.export = Trafik; 
+0

试试在Trafik最后一行替换为导出默认Trafik;检查是否有帮助 –

+0

我将如何写在trafik.js? export default = Trafik;或module.export.default = Trafik;或.... –

+0

导出默认Trafik;像这样 –

回答

1

尝试此在Trafik.js最后一行替换 module.export = Trafik; 与 导出默认Trafik;

相关问题