Реагировать - как проверить, была ли изменена ссылка

Question

У меня есть компонент класса:

      class WarehouseTypeForm extends PureComponent {
    constructor(props) {
        super(props);
        this.warehouseQuantityRef = React.createRef();
    }

render() {
        const {
            onSubmit, onError, eventsEmitter, model, labels, operationType, onWarehouseNumberChanged,
        } = this.props;
       ...

        ...
        return (
            <div>
                <div onClick={this.aaa}>check current ref values</div>
                <div className={classNames(styles.warehouseTypeInfo)}>
                    {labels.warehouseTypeInputInfo}
                </div>
                <Form
                    eventsEmitter={eventsEmitter}
                    model={model}
                    onError={onError}
                    onSubmit={onSubmit}
                    schema={schema}
                    showErrorContainer={false}
                >

                    <ListField
                        ref={this.warehouseQuantityRef}
               >

Я использую какой-то внешний компонент ListField - с помощью этого компонента я могу добавлять новые строки / новые склады, нажав на Addкнопка. Чего я хочу добиться? Я хочу определить, когда ref={this.warehouseQuantityRef} изменилось, и затем я хочу вернуться к компоненту, который вызывает этот компонент:

      const WarehouseTypeBody = ({ next, currentStep, translations, operationType }) => {
const [manyWarehouses, setManyWarehouses] = useState(false);


  const onWarehouseNumberChanged = (addedWarehouses) => {
        const multipleWarehouses = addedWarehouses.some((ramp) => warehouse.quantity > 1);
        if (multipleWarehouses ) {
            setManyWarehouses(true);
        } else {
            setManyWarehouses(false);
        }
    };
...

return (
        <Provider context="context" translations={translations}>
            <div className={classNames(styles.container)} data-ctx="warehouse-step">
                {manyWarehouses ? <manyWarehousesInfo /> : null}
                <WarehouseTypeForm
                    model={allData[currentStep]}
                    onWarehouseNumberChanged={onWarehouseNumberChanged}

Из моего компонента класса я хочу получить this.warehouseQuantityRef

и в моем функциональном компоненте я хочу перебрать this.warehouseQuantityRef.current`` every time ref has changed and check if there is some item with some field value > 1, then I set setManyWarehouses to true and then I want to display some component:{manyWarehouses? : null}``

В настоящее время я написал несколько методов onClick, чтобы быть уверенным, что моя ссылка всегда обновляет контент:

      aaa = () => {
        console.log('REF: ', this.rampQuantityRef.current);
    }
<div onClick={this.aaa}>click me to console current ref values</div>```