Начальная загрузка React-рендерера: как получить ссылку на корневое представление при запуске приложения?

Question

Я создаю React-рендер для NativeScript (т. Е. Чтобы вы могли использовать React в качестве инфраструктуры пользовательского интерфейса для NativeScript).

ReactNativeScript.render() (эквивалент более известногоReactDOM.render()) для рендеринга необходим корневой узел (контейнер AKA).Таким образом, мне нужно получить ссылку на представление корня приложения во время запуска (которое я буду использовать в качестве корня React).Однако я сталкиваюсь с трудностями:

/* app.ts */
import { on, run, launchEvent, getRootView } from "tns-core-modules/application";

console.log(getRootView());
// application root view is undefined

on(launchEvent, (data) => {
    console.log(data.root);
    // application launch event's data.root is undefined
});
run();

Очевидно, что я неправильно понимаю жизненный цикл приложения здесь.Как получить ссылку на корневой вид (фрейм) приложения при запуске?

Связанные процессы начальной загрузки:

• Nativescript Vue runtime/index.js
• NativeScript Angular platform-common.ts

Answer 1

Вы должны создать корневое представление самостоятельно https://github.com/nativescript-vue/nativescript-vue/blob/master/platform/nativescript/runtime/index.js#L73

Сначала вы создаете свое корневое представление, а затем устанавливаете его на data.root. Что-то вроде:

on(launchEvent, (data) => {
    const myComponent = new ReactComponent();
    data.root = myComponent.native;
});