Как обновить react.fragment

У меня есть два компонента: один родительский (РК) другой дочерний (ДК). РК монтируется только один раз а ДК постоянно обновляемый отслеживает redux.store. И еще ДК обворачивается в react.fragment. Когда в ДК добавляется новые элементы всё хорошо монтируется а вот когда из ДК убирается всё валится дает ошибку:

react-dom.development.js:7735 Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

Самое интересное если из ДК код вставить в РК то всё работает, только постоянно, когда сторе изменяется РК перемонтируется. Так, как РК это карусель при перемонтировке всё с заново начинается а там где остановился. По этому решил его вытащить и разделить от ДК. Как можно решить такую неприятную задачу, подскажите кто знает?

Родительский компонент:

    const Carousel = function (){

    return (<OwlCarousel {...{
        id: 'owl-carousel',
        margin: 2,
        autoWidth: true,
        nav: true,
        dots:false
    }}>
        <Navs/>
    </OwlCarousel>);
}


export default Carousel

Дочерний компонент:

const Navs = (props) => {

    const [key, setKey] = useState('meeting_room_' + getActiveMeetingRoomId());

    return (<React.Fragment key={1}>
            {props.interview_meeting_rooms.map((element, idx) => <Nav.Item key={idx}>
                <Nav.Link eventKey={'meeting_room_' + element.id}
                          active={'meeting_room_' + element.id === key}
                          onSelect={k => setKey(k)}
                          onClick={props.setActiveCalendar.bind(element)}
                >
                    {element.address !== null ? element.address.label : 'Переговорная (' + idx + ')'}
                </Nav.Link>
            </Nav.Item>)}
        </React.Fragment>
    );
}

export default connect(store => store.interviewBuilder)(Navs);

Ответы (0 шт):