在React的許多其他組件中調用組件方法的正確方法是什麼？

我正在使用React with Meteor。我目前正在構建一個應用程序，這個應用程序已經具有相當數量的組件（一些嵌套相當深，比如5層或更多層）。在React的許多其他組件中調用組件方法的正確方法是什麼？

我經常發現自己不得不從父一路傳遞道具給孩子，只是調用組件的方法，已在最頂層父被渲染的成分，像這樣：

父文件

openDialog() { 
    this.setState({ open: true }); 
} 

render() { 
    return (
    <div> 
     <Dialog open={ this.state.open } /> 
     <ChildComponent openDialog={ this.openDialog.bind(this) } /> 
    </div> 
); 
}

ChildComponent

render() { 
    return (
    <div> 
     <GrandChildComponent openDialog={ this.props.openDialog } /> 
    </div> 
); 
}

等等，只是爲了調用最上面的父級定義的openDialog方法。

如果您只有一個分支進入更深處，此方法可行。然而，如果你說，一個可以從站點的多個不同部分觸發的登錄模式對話框（標題，邊欄，內聯鏈接等），將道具以這種方式傳遞到每個可能需要的組件中顯然是不切實際的鏈接（或不）。

什麼是正確（推薦）的方式來處理這類問題？

來源

2016-06-20 Irvin Lim

常見的解決方案是將組件連接到一組外部操作和一個外部狀態管理器。 Flux architecure用於此目的。像Redux這樣的幾個框架可以幫助您將其與React集成。

使用flux，您可以從每個組件派發一個動作（例如，openDialog），而不必將其傳遞到整個組件樹。

來源

2016-06-20 08:49:42

在React的許多其他組件中調用組件方法的正確方法是什麼？

回答

相關問題