2017-03-06 55 views
1

我有一個項目(作業)列表,並且正在選擇一個項目(作業)時,正在打開一個新場景。我希望將選定項目的ID從列表中的場景傳遞到其他場景,並顯示有關所選項目(作業)的詳細信息,而無需使用Redux。React Native Router Flux:在場景之間傳遞參數

路由器

import React from 'react'; 
import { Scene, Router } from 'react-native-router-flux'; 
import JobsList from './components/JobsList'; 
import Job from './components/Job'; 

const RouterComponent =() => { 
    return (
    <Router> 
     <Scene key="jobs" component={JobsList} initial /> 
     <Scene key="Job" component={Job} title="Test" /> 
    </Router> 
); 
}; 
export default RouterComponent; 

作業列表

import React, { Component } from 'react'; 

export default class JobsList extends Component { 
    render() { 
    return (
     <TouchableOpacity onPress={() => { Actions.Job({ jobId: jobId }) }}> 
     ... 
     </TouchableOpacity> 
    ); 
    } 
} 

工作

import React, { Component } from 'react'; 
export default class Job extends Component { 
    constructor() { 
    super(); 

    this.state = { 
     job: {} 
    }; 

    axios.get(
     // PROBLEM: this.props.jobId is empty 
     `http://api.tidyme.dev:5000/${this.props.jobId}.json`, 
     { 
     headers: { Authorization: 'Token token=123' } 
     } 
    ).then(response => this.setState({ 
     job: response.data 
    })); 
    } 

    render() { 
    return (
     <Text>{this.state.job.customer.firstName}</Text> 
    ); 
    } 
} 

回答

4

你應該叫super(props)如果您要訪問this.props在構造函數中。

constructor(props) { 
    super(props); 
    console.log(this.props); 
} 
+0

感謝。這是最佳做法,還是應該設置Redux來處理這個問題? – migu

+0

如果道具被許多場景使用,那麼REDX會更好。否則,以上應該足夠好。 – vinayr

0

最好的做法是定義組分作爲純功能:

const Job = ({ job, JobId}) => { 
return (
    <Text>{job.customer.firstName}</Text> 
); 
} 

otherFunctions() { 
    ... 
} 
相關問題