В response.js есть ли способ отключить все дочерние события

Question

Я хочу создать приложение, которое имеет два состояния; пауза и активность. Например, я хочу отключить все события дочерних/принадлежащих компонентам, такие как onClick, onChange, onKeyDown, .etc.

Я подумал дать isActive=false пропущен всем своим дочерним/принадлежащим компонентам и проверить имущество isActive на обработчиках событий. Если свойство isActive является фальсифицированным обработчиком событий, он ничего не сделает. Я могу сделать этот механизм еще проще с помощью простой вспомогательной функции. Но я беспокоюсь, когда я изменил состояние приложения на паузу, все дочерние компоненты нужно повторно отобразить.

Im ищет способ обойти все обработчики событий (нестандартные) без повторной обработки всех компонентов.

ОБНОВЛЕНИЕ: Я смотрю рендеринг прямоугольников на хромированном конце, это не дает детям. Но если есть какой-нибудь лучший реактивный способ сделать это, я хочу это изучить.

Answer 1

Один из способов решения этой проблемы - использовать простую защитную абстракцию. Вот как это работает:

var sayHi = guard("enabled", function(){ 
    alert("hi"); 
}); 

guard.deactivate("enabled"); 
sayHi(); // nothing happens 
guard.activate("enabled"); 
sayHi(); // shows the alert 

Используя это для обработчиков событий аналогично:

handleChange: guard("something", function(e){ 
    // if 'something' is deactivated, the input won't change 
    this.setState({value: e.target.value}); 
}) 

// or 

return <div onClick={guard("something", this.handleClick)}>click me!</div> 

Вот реализация охранником

var guard = function(key, fn){ 
    return function(){ 
    if (guard.flags[key]) { 
     return fn.apply(this, arguments);  
    } 
    }; 
}; 

guard.flags = {}; 
guard.activate = function(key){ guard.flags[key] = true }; 
guard.deactivate = function(key){ guard.flags[key] = false };