Typescript 路由上的离子路由器

我使用的是与redux集成的stencil basic应用程序，以及与电容器集成的所有应用程序。发生错误时，我想敬酒。我的

app root.tsx

如下所示：

    @State() error: any;

    componentWillLoad() {
        this.store.setStore(configureStore({}));

        this.store.mapStateToProps(this, (state: RootState) => {
            const { error, isStatusBarLight } = state.app;
            return { error, isStatusBarLight };
        });
    }

    @Watch('isStatusBarLight')
    onIsStatusBarLightChange() {
        return this.setStatusBarStyle();
    }

    async setStatusBarStyle() {
        try {
            await StatusBar.setStyle({
                style: this.isStatusBarLight ? StatusBarStyle.Dark : StatusBarStyle.Light,
            });
        } catch (err) {
            this.error = err.toString();
        }
    }

    @Watch('error')
    onErrorChange(err: string) {
        if (err) {
            this.toast.message = err;
            this.toast.duration = 2000;
            return this.toast.present();
        }
        return Promise.resolve();
    }

    render() {
        return (
            <ion-app>
                <ion-router useHash={false}>
                    <ion-route url='/' component='app-home' />
                    <ion-route url='/settings' component='app-settings' />
                </ion-router>
                <ion-nav />
                <ion-toast message='' duration={2000} ref={elm => this.toast = elm}></ion-toast>
            </ion-app>
        );
    }

---

我不是在寻找解决办法，我在寻找一种在整个应用程序中呈现情态和祝酒的方法，通过应用程序状态向用户呈现此类消息的统一方式。请，有人能帮我吗？

现在，我决定每次制作一个新的祝酒词：

@Element() me: HTMLElement;

@Watch('error')
onErrorChange(err: string) {
    if (err) {
        const toast: HTMLIonToastElement = document.createElement('ion-toast');
        toast.message = err;
        toast.duration = 2000;
        toast.onDidDismiss().then(() => toast.remove());
        this.me.appendChild(toast);

        return toast.present();
    }
    return Promise.resolve();
}

render() {
    return (
        <ion-app>
            <ion-router useHash={false}>
                <ion-route url='/' component='app-home' />
                <ion-route url='/settings' component='app-settings' />
            </ion-router>
            <ion-nav />
        </ion-app>
    );
}

@Element（）me:HTMLElement；
@监视（'错误'）
OneErrorChange（错误：字符串）{
如果（错误）{
常量toast:htmliontoast元素=document.createElement（'ion-toast'）；
toast.message=err；
toast.duration=2000；
toast.ondiddisease（）。然后（（）=>toast.remove（））；
这是我的孩子（吐司）；
返回toast.present（）；
}
返回承诺。解决（）；
}
render（）{
返回(
);
}

@Element() me: HTMLElement;

@Watch('error')
onErrorChange(err: string) {
    if (err) {
        const toast: HTMLIonToastElement = document.createElement('ion-toast');
        toast.message = err;
        toast.duration = 2000;
        toast.onDidDismiss().then(() => toast.remove());
        this.me.appendChild(toast);

        return toast.present();
    }
    return Promise.resolve();
}

render() {
    return (
        <ion-app>
            <ion-router useHash={false}>
                <ion-route url='/' component='app-home' />
                <ion-route url='/settings' component='app-settings' />
            </ion-router>
            <ion-nav />
        </ion-app>
    );
}