ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Teact: Fix re-mounting components

Browse Source
This commit is contained in:
Alexander Zinchuk 2025-03-07 15:16:46 +01:00
parent d0504015d4
commit 90e56dcdd4
2 changed files with 8 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/teact/teact-dom.ts
View File

@ -253,7 +253,7 @@ function initComponent(
$element.componentInstance.context = currentContext; $element.componentInstance.context = currentContext;
if (componentInstance.mountState === MountState.New) { if (componentInstance.mountState === MountState.Unmounted) {
$element = mountComponent(componentInstance); $element = mountComponent(componentInstance);
setupComponentUpdateListener(parentEl, $element, $parent, currentContext, index); setupComponentUpdateListener(parentEl, $element, $parent, currentContext, index);
} }

21
src/lib/teact/teact.ts
View File

@ -66,7 +66,7 @@ export interface RefObject<T = any> {
} }
export enum MountState { export enum MountState {
New, Mounting,
Mounted, Mounted,
Unmounted, Unmounted,
} }
@ -196,7 +196,7 @@ function createComponentInstance(Component: FC, props: Props, children: any[]):
Component, Component,
name: Component.name, name: Component.name,
props, props,
mountState: MountState.New, mountState: MountState.Unmounted,
}; };
componentInstance.$element = buildComponentElement(componentInstance); componentInstance.$element = buildComponentElement(componentInstance);
@ -463,14 +463,8 @@ export function renderComponent(componentInstance: ComponentInstance) {
} }
componentInstance.renderedValue = newRenderedValue; componentInstance.renderedValue = newRenderedValue;
const children = Array.isArray(newRenderedValue) ? newRenderedValue : [newRenderedValue]; const children = Array.isArray(newRenderedValue) ? newRenderedValue : [newRenderedValue];
componentInstance.$element = buildComponentElement(componentInstance, children);
if (componentInstance.mountState === MountState.New) {
componentInstance.$element.children = buildChildren(children, true);
} else {
componentInstance.$element = buildComponentElement(componentInstance, children);
}
return componentInstance.$element; return componentInstance.$element;
} }
@ -497,13 +491,14 @@ export function hasElementChanged($old: VirtualElement, $new: VirtualElement) {
export function mountComponent(componentInstance: ComponentInstance) { export function mountComponent(componentInstance: ComponentInstance) {
componentInstance.id = ++lastComponentId; componentInstance.id = ++lastComponentId;
componentInstance.mountState = MountState.Mounting;
renderComponent(componentInstance); renderComponent(componentInstance);
componentInstance.mountState = MountState.Mounted; componentInstance.mountState = MountState.Mounted;
return componentInstance.$element; return componentInstance.$element;
} }
export function unmountComponent(componentInstance: ComponentInstance) { export function unmountComponent(componentInstance: ComponentInstance) {
if (componentInstance.mountState !== MountState.Mounted) { if (componentInstance.mountState === MountState.Unmounted) {
return; return;
} }
@ -565,13 +560,11 @@ function helpGc(componentInstance: ComponentInstance) {
componentInstance.hooks = undefined as any; componentInstance.hooks = undefined as any;
componentInstance.$element = undefined as any; componentInstance.$element = undefined as any;
componentInstance.renderedValue = undefined; componentInstance.renderedValue = undefined;
componentInstance.Component = undefined as any;
componentInstance.props = undefined as any;
componentInstance.onUpdate = undefined; componentInstance.onUpdate = undefined;
} }
function prepareComponentForFrame(componentInstance: ComponentInstance) { function prepareComponentForFrame(componentInstance: ComponentInstance) {
if (componentInstance.mountState !== MountState.Mounted) { if (componentInstance.mountState === MountState.Unmounted) {
return; return;
} }
@ -583,7 +576,7 @@ function prepareComponentForFrame(componentInstance: ComponentInstance) {
} }
function forceUpdateComponent(componentInstance: ComponentInstance) { function forceUpdateComponent(componentInstance: ComponentInstance) {
if (componentInstance.mountState !== MountState.Mounted || !componentInstance.onUpdate) { if (componentInstance.mountState === MountState.Unmounted || !componentInstance.onUpdate) {
return; return;
} }