Как обновить данные из redux store вне приложения react?

Question

[Марат Долотов]

Есть app react и просто js файлы вне реакта, которые просто работают с DOM.
Из js, как только получил данные через ajax вызываю api метод из app react для обновления данные в store. В console вижу, что произошли изменении, но оказалось, что создается новое store и данные записываются туда. А основное store вообще не тронут. Очень надеялся, что вызову api метод и задача будет решена, оказалось, что нет. Подскажите, на сколько реально обновить данные из redux store обносить со стороны js?

api methods
```

export function setPersonalCardImage(image){
    store.dispatch(actionSetPersonalCardImage(image));
}
export function setPersonalCardFio(fio){
    store.dispatch(actionSetPersonalCardFio(fio));
}
export function setPersonalCardBirthDay(birth_day){
    store.dispatch(actionSetPersonalCardBirthDay(birth_day));
}
export function setPersonalCardAge(age){
    store.dispatch(actionSetPersonalCardAge(age));
}

export function loadData(data){
    setPersonalCardAddress(data.address);
    setPersonalCardAge(data.age);
    setPersonalCardBirthDay(data.birth_day);
    setPersonalCardContactList(data.contact_list);
    setPersonalCardFio(data.fio);
    setPersonalCardFullAddress(data.full_address);
    setPersonalCardCoords(data.coords);
    setPersonalCardHasChildren(data.has_children);
    setPersonalCardImage(data.image);
    setPersonalCardPlaceId(data.geo_place_id);
    setPersonalCardPlaceName(data.geo_place_name);
    setPersonalCardRelocation(data.relocation);
    setPersonalCardRelocationPlaces(data.relocation_places);
    setPersonalCardSex(data.sex);
    setPersonalCardSocialStatus(data.social_status);
    setPersonalCardZodiac(data.zodiac);
}

loadData api метод вызываю и заполняю данные пред загрузкой страницы,
так работает, всё хорошо.

if(document.getElementById('personal-card')){
    let data = $('#personal-card').attr('cu-personal-card-data');
    if(data !== undefined && data !== false && data!=='[]'){
        loadData(data ); // loadData api method
        $('#personal-card').removeAttr('cu-personal-card-data');
    }

    ReactDOM.render(
        <Provider store={store}>
            <PersonalCard/>
        </Provider>,
        document.getElementById('personal-card'),
    );
}

Но, как только вызываю loadData api метод вне app react (из обычного js файла) после получении данные из сервера, данные записываются на новое store, а основной не обновляется.

import { loadData } from "../../../../../../../../../frontend/web/js/react/api/personal-card-api";
updatePersonalCard = () => {
            $.ajax({
                url: 'get-personal-card-data',
                type: 'post',
                dataType: 'json',
                success: function(data){
                    loadData(data); // api method
                }
            });
        },

Answer 1

[Владимир]

Вот пример, из внешнего события обновляю стор в редаксе
https://codesandbox.io/s/async-currying-96exm?font...

Только есть одно но, перед тем как вызывать onclick="onSetSize(9,9)" нужно убедиться что эта функция уже есть в window