React中的解耦功能

我在想如何解耦一些React組件 - 特別是模態 - 以便打開模塊的組件不需要知道它們是如何打開的。React中的解耦功能

舉例來說，在jQuery的我可以做這樣的事情：

var $modal = $(".modal"); 
var modals = {}; 

/* Gets a modal dialog 
*/ 
function _get_modal(modal) { 
    if(modals[modal] === undefined) { 
    modals[modal] = $(".modal-dialog[data-modal=" + modal + "]"); 
    } 

    return modals[modal]; 
} 

/* Shows the modal page dimmer and the modal dialog 
*/ 
function show_modal(modal) { 
    var $m = _get_modal(modal); 

    $modal.show(); 
    $m.show(); 

    return $m; 
} 

// Later in a click event listener somewhere... 
show_modal("MyModal");

如果我想在作出反應好像我需要從我的父組件向下傳遞的功能，所有做同樣的事情孩子和孩子的孩子，以便他們知道如何觸發模式。

理想情況下，我想抽象我能夠實現的命令模式。

來源

2017-04-21 user2896976

你看過反應嗎？它已經封裝了模態。 https://github.com/reactjs/react-modal。即使你沒有使用它，你也可能知道如何將事物封裝在反應中。一個注意：命令模式是一個OOP模式，反應有一個功能方法。研究如何以功能方式處理更多事情。 HTH

來源

2017-04-21 22:04:13 silverfighter

'react-modal'沒有幫助。在他們的[示例]（https://github.com/reactjs/react-modal#examples）中，「App」需要提供打開模式的功能，並且該功能通過「onClick」屬性傳遞給子節點。它仍然是耦合的。 – user2896976

所有的模態函數都在一個組件中分開，並且肯定在某個時刻它需要被調用，但我在這裏沒有看到問題。由於React中的所有東西都是一個函數，所以在編寫返回的函數時，沒有什麼東西會阻止您，但請記住它是反應思維模式（與jQuery不同）的React。也許你還應該發佈你的React代碼，我們會看看。 – silverfighter

React中的解耦功能

回答

相關問題