HarmonyOS 鸿蒙Next有封装好的Loading组件吗? 主要用在网络请求前显示, 请求结束隐藏的场景中

HarmonyOS 鸿蒙Next有封装好的Loading组件吗? 主要用在网络请求前显示, 请求结束隐藏的场景中 鸿蒙有封装好的Loading组件吗? 主要用在网络请求前显示, 请求结束隐藏的场景中

2 回复

文档是一点都不看阿： https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V14/ts-basic-components-loadingprogress-V14

更多关于HarmonyOS 鸿蒙Next有封装好的Loading组件吗? 主要用在网络请求前显示, 请求结束隐藏的场景中的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


HarmonyOS提供了封装好的Loading组件，可用于在网络请求前显示、请求结束后隐藏的场景。开发者可以使用ProgressBar组件来实现这一功能。ProgressBar组件支持多种样式，包括圆形进度条和线性进度条，适用于不同的UI需求。

在鸿蒙Next中，可以通过ProgressBar组件的visibility属性来控制其显示与隐藏。例如，在网络请求开始时，将visibility设置为Visible，请求结束时设置为Invisible或Gone。

示例代码片段如下：

import prompt from '@system.prompt';
import fetch from '@system.fetch';

export default {
    data: {
        isLoading: false
    },
    onInit() {
        this.isLoading = false;
    },
    onRequest() {
        this.isLoading = true;
        fetch.fetch({
            url: 'https://example.com/api',
            success: (data) => {
                this.isLoading = false;
                prompt.showToast({
                    message: '请求成功'
                });
            },
            fail: (err) => {
                this.isLoading = false;
                prompt.showToast({
                    message: '请求失败'
                });
            }
        });
    }
}

在布局文件中使用ProgressBar组件：

<ProgressBar
    ohos:id="$+id:loading"
    ohos:width="match_content"
    ohos:height="match_content"
    ohos:visibility="{{isLoading ? 'visible' : 'invisible'}}"
/>

通过这种方式，开发者可以方便地在网络请求过程中显示和隐藏Loading组件。

回到顶部