2017-03-07 101 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;

相關問題