傳遞道具給兒童使用路線

圍繞我所問的問題有很多問題和答案，但我覺得我正在閱讀它並正確應用它只是沒有工作，我得到了我的undefined props每次。傳遞道具給兒童使用路線

所以我這裏有我的父組件：

讓滿足= { 標題： '有些標題'， };

Meteor.startup(() => { 
    render((
    <Router> 
     <div> 
     <Nav /> 
     <Route exact path="/" component={Start} dataMeeting={meeting} /> 
     <Route path="/app" component={App} /> 
     <Modal /> 
     </div> 
    </Router> 
), document.getElementById('render-target')); 
});

然後在我的其他文件，其中我Start組件是我做的一個console.log上this.props

export default class Start extends Component { 
    render() { 
    console.log(this.props.dataMeeting); 
    return (
     <div className="home"> 
     <p>test</p> 
     </div> 
    ); 
    } 
}

在我console.log我回來不確定，當我剛console.log的this.props我看不到我的dataMeeting在對象中。

任何想法，爲什麼我誤解？

謝謝！

來源

2017-04-25 PourMeSomeCode

看起來你正在使用react-router V4，您可以通過使用道具render代替component通過道具：

<Route path="/" render={()=><Start dataMeeting={meeting} />}/>

由於@ToddChaffe指出的那樣，你可以（但不應該）在使用component道具同樣的方式：

<Route path="/" component={()=><Start dataMeeting={meeting} />}/>

然而，這將重新創建每個渲染組件。

來源

2017-04-25 16:53:01

謝謝你的幫助！我的頭幾個小時都在砸我的頭，不明白爲什麼它不工作。現在有道理:)再次感謝！ – PourMeSomeCode

完全沒問題，樂於幫忙！ 'react-router'文檔最近一直是一個移動的目標！ :-) –

您可能想補充一點，您還可以使用組件「} />'。而且如果你這樣做的話，它有在每個渲染中重新創建組件的缺點，這是使用'render'的主要原因。 –

這是非常不完善的文件，但你應該使用this.props.route。

export default class Start extends Component { 
    render() { 
    console.log(this.props.route.dataMeeting); 
    return (
     <div className="home"> 
     <p>test</p> 
     </div> 
    ); 
    } 
}

來源

2017-04-25 16:53:54 jered

只能用於React Router

傳遞道具給兒童使用路線

回答

相關問題