在使用ref-callback并将它们保存到数组中时，如何在卸载时清理子组件？

Question

好的，所以我现在一直在用这个问题摸不着头脑。

我有一个组件可以克隆并保存对集合中每个子组件的引用（使用ref-callback）。

我一直困扰的是如何在孩子的componentWillUnmount

的ref-callback中获取null时取消订阅这个孩子

我已经考虑过将一个取消订阅方法传回给孩子，但是一直停留在存放它的地方。例如。 return () => this.subscribers.delete(newSubscriber)

我的最后一个想法是将订阅者数组与componentWillUpdate中的新子项进行比较，但这种感觉就像是妥协。

我可能会遗漏一些明显的东西，所以欢迎所有的输入！

subscribe(child) { 
    const newSubscriber = { 
        component: child, 
        domNode: ReactDOM.findDOMNode(child), 
        ...otherStuff 
    }

    this.subscribers.add(newSubscriber);
}

render() {
    return React.Children
                .map(this.props.children, 
                     child => React.cloneElement(child, { ref: this.subscribe })
}

附上一个基本的例子：

https://jsfiddle.net/2t78r2ro/1/