來自其他組件的調用組件方法

-1

單擊組件B中的按鈕時，調用組件A中方法的最佳方式是什麼？來自其他組件的調用組件方法

兩個組件都相互分離。我相信我可以用一些非常幼稚的做法有類似的動作：

成分A發送的動作：

{action: "BUTTON_CLICKED", value: true}

減速抓捕行動：

case "BUTTON_CLICKED": { 
     const newState = { ...state }; 
     newState.clicked = true; 
     return newState; 
    }

B組分聽道具::

componentWillReceiveProps = (newProps) => { 
    if (newProps.clicked) { 
     someMethod() 
    } 
};

and reset flag：

someMethod =()=>{ 
    dispatch({action: "BUTTON_CLICKED", value: false}) 
}

但是這種方式是錯誤的。

任何方式來實現命令模式在react/redux？

謝謝

來源

2017-08-10 5minutes2start

你爲什麼這麼說錯了？ –

真的嗎？爲什麼組件B應該知道組件A中的任何按鈕？ – 5minutes2start

好吧，redux以這種方式工作。它是您應用程序中的單一真相源。因此，組件B將知道有關組件A的更改，但通過還原存儲。代碼看起來很乾淨我 –

你問和嘗試解釋是最好的模式。你寫了適當的代碼，我認爲你不需要改變它。

看到您在單一事實源頭的幫助下使用Redux。所以根據我的觀點，無論你使用什麼都是正確的。

來源

2017-08-10 07:18:20

「單擊組件B中的按鈕時，調用組件A中方法的最佳方法是什麼？」

我會使用事件總線消息傳遞模塊之間進行通信。您確實在一個模塊和其他模塊中偵聽特定事件的事件。

例子：https://github.com/olahol/react-bus

這裏是VueJS相關文章http://vuetips.com/global-event-bus，但它應該給有關想法的概述。

來源

2017-08-10 07:21:00

你說得對，事件公共汽車是最好的選擇，但我認爲REDX有一些事件總線的實現。 – 5minutes2start

你已經佈置的方法似乎是正確的。 Redux內置了此功能。您可以使用store.subscribe來聆聽更改。

componentWillMount() { 
    this.unsubscribe = store.subscribe(this.onStoreChange); 
} 

componentWillUnmount() { 
    this.unsubscribe(); 
} 

onStoreChange =() => { 
    const newState = store.getState(); 

    // Check if target value has changed here 
}

來源

2017-08-10 07:28:04 NiFi

來自其他組件的調用組件方法

回答

相關問題