黑名单React组件

Question

有没有办法在我的应用程序中的每个组件安装之前定义要挂钩的函数？

这个想法是,如果一个组件被列入黑名单,它根本不会安装.

该解决方案必须保持组件不被修改以便向后兼容并且应该在生产中运行(因此重新连接和其他测试工具可能不在桌面但是可以接受建议:))

例

//something like this...
ReactDOM.beforeEachComponentMount( (component, action) => {
    if(isBlacklisted(component)){
        action.cancelMountComponent();
    }
}

Answer 1

你能写一个简单的Babel插件,() => {}在编译时将列入黑名单的组件转换为noop功能组件吗？

Answer 2

没有这样的开箱即用功能。

你可以填充React渲染周期，我的意思是填充React.createElement方法并在将其添加到VDOM之前验证组件

所有 JSX 均通过以下方式处理React.createElement

例如在应用程序的开头添加

let React = require('react');
let originalCreateElement = React.createElement;
React.createElement = function() {
    let componentConstructorOrStringTagName = arguments[0];
    if (isBlacklisted(componentConstructorOrStringTagName)) {
        return null;
    }
    return originalCreateElement.apply(this, arguments);
}