詢問 - 通過反應本機可滾動選項卡視圖中的道具

Question

因此，我正在使用React本機，

這是我的主菜單代碼。從這裏，每次用戶點擊SOURS按鈕，我想導航到Sours頁面並通過道具數量：'50'。 （從這裏逝去的工作如我所料）：

import React, { Component } from 'react'; 
import { 
    View, 
    Text, 
    Alert, 
    TouchableOpacity, 
    TouchableHighlight, 
    StyleSheet, 
    Image 
} from 'react-native'; 
import { Container, Header, Title, Button, Icon, Content, Thumbnail } from 'native-base'; 


module.exports = React.createClass({ 
    render() { 
     return (
      <View style={styles.background}> 
      <Container> 
       <Content> 
       <View style={styles.buttonWrapper}> 
        <View style={styles.center}> 
         <TouchableHighlight 
         onPress={() => {this.props.navigator.push({name: 'Sours', amount: '50'})}} 
         style={styles.buttonMain_} 
         underlayColor="#c5e29e" > 
         </TouchableHighlight> 
         <Text style={styles.BtnMainText_}>SOURS</Text> 
        </View> 
       </View> 
       </Content> 
      </Container> 
      </View> 
     ); 
    } 
}) 

這是我的蘇爾 - 代碼。在本節中，我正在使用react-native-scrollable-tab-view組件，我試圖登錄{this.props.amount}並且它給了我結果。 （從這裏開始，我的工作就如我所料）。
然後我試圖通過{this.props.amount}到塔伯恩頁中」 ./sours_comp/sours'

import React, { Component } from 'React'; 
import { 
    Image, 
    View, 
    StyleSheet, 
} from 'react-native'; 
import Swiper from 'react-native-scrollable-tab-view' 

import TabOne from './sours_comp/sours' 
import TabTwo from './sours_comp/history' 

module.exports = React.createClass({ 
    componentDidMount(){ 
    console.log(this.props.amount); 
    }, 

    render(){ 
    return(
     <View> 
     <Container> 
      <Header> 
      <Button transparent onPress={() => this.props.navigator.pop()}> 
       <Icon name='ios-arrow-back' /> 
      </Button> 
      <Title>Sours</Title> 
      </Header> 

      <Content> 
      <Swiper> 
       <TabOne tabLabel='Sours' > 
       <TabOne amount={this.props.amount} /> // I tried to pass the amount props 
       </TabOne> 
       <TabTwo tabLabel='History' /> 
      </Swiper> 
      </Content> 
     </Container> 
     </View> 
    ) 
    } 
}) 

在這種塔伯恩代碼部分，我試圖登錄{this.props.amount}它給我的結果undefined。

This is my TabOne - Codes. 
import React, { Component } from 'React'; 
import { 
    View, 
    Text, 
    Alert 
} from 'react-native'; 

module.exports = React.createClass({ 
    componentDidMount(){ 
    console.log(this.props.amount); 
    }, 

    render(){ 
    return(
     <View> 
     <Text>Hallo {this.props.amount}</Text> 
     </View> 
    ) 
    } 
}) 

你們能幫我解決這個問題嗎？

Answer 1

解決 - 我知道我在這行（SOURS.js代碼）犯的錯誤：

<TabOne tabLabel='Sours' > 
<TabOne amount={this.props.amount} /> // I tried to pass the amount props 
</TabOne> 

我這是怎麼解決這個問題：

<TabOne tabLabel='Top Up' 
navigator={this.props.navigator} 
topupAmount={this.props.amount} > 
</TabOne>