Question

我正在尝试将这种功能重构为离子4。麻烦的是，这些进口中有一半不再存在。有谁知道v4中的OverlayBaseController，Loading现在在哪里？

import {ToastController, LoadingController, OverlayBaseController, Loading } from "ionic-angular"

/**
 * Wraps an asynchronous call with the LoadingController overlay
 * @param action the action to execute
 * @param loadingMessage the loading message to display
 * @returns {Promise<T>}
 */
async loading<T>(action: Promise<T>, loadingMessage?: string): Promise<T> {
    // Delay showing the loading spinner for 0.4s
    // See http://yuiblog.com/blog/2010/11/11/improving-perceived-site-performance-with-spinners/
    // Hopefully delay is re-implemented. See https://github.com/ionic-team/ionic/pull/11583
    let loadingOptions: OverlayBaseController = {} // delay: 400
    if (loadingMessage)
        loadingOptions.content = loadingMessage
    let loader: Loading = await this.loadingCtrl.create(loadingOptions)
        await loader.present().catch(this.log.warn)
    try {
        let result: T = await action
        loader.dismiss()
        return result
    } catch (e) {
        loader.dismiss()
        throw e
    }
}

Answer 1

以下内容如何？我已使用docs作为参考，似乎没有必要使用OverlayBaseController或Loading。

import { LoadingController } from '@ionic/angular';

async loading<T>(action: Promise<T>, loadingMessage?: string): Promise<T> {
    const loader = await this.loadingCtrl.create({
      message: loadingMessage
    });
    await loader.present().catch(this.log.warn);
    try {
      const result: T = await action;
      loader.dismiss();
      return result;
    } catch (e) {
      loader.dismiss();
      throw e;
    }
  }

我删除了有关延迟的评论。该评论似乎过时且令人困惑，因为没有选项可以延迟加载屏幕...

只要有可能，我也会从let转到const，但这不会损害功能。

如果loadingMessage未定义，最好处理这种情况。也许您可以显示诸如请稍候... 之类的通用消息，这可以通过默认参数来完成。因此，您必须像这样更改签名：

async loading<T>(action: Promise<T>, loadingMessage = 'Please wait ...'): Promise<T>

有关默认参数的更多信息，您还可以签出Typescript docs。

Ionic 4加载组件相对于v3的更改

1 个答案: