vue.js - 如何在 NativeScript/Vue 中自定义 Pull-To-Refresh 指示器样式？

Question

我正在尝试在 NativeScript/Vue 应用程序中自定义 Pull-To-Refresh 指示器的样式。Vue 似乎没有示例代码。我尝试将以下从 Angular 改编的代码放入，运行应用程序时出错。

<RadListView.pullToRefreshStyle>
    <PullToRefreshStyle indicatorColor="white" indicatorBackgroundColor="blue"/>
</RadListView.pullToRefreshStyle>

任何人都可以提供一个工作示例或更新以下页面吗？ https://docs.nativescript.org/vuejs/ns-ui/ListView/pull-to-refresh

另一方面，根据此处的文档： https ://docs.nativescript.org/ns-ui-api-reference/classes/pullorefreshstyle

只能自定义颜色和背景颜色。有没有办法绕过指标的这种变化大小？

我能想到的唯一方法是将指标的前景和背景都设置为透明，然后使用页面级别的activityIndi​​cator。

标签： vue.jsnativescript

Answer 1

只需在属性上设置pullToRefreshStyle属性

HTML

<RadListView :pullToRefreshStyle="pullToRefreshStyle">

脚本

import * as colorModule from "tns-core-modules/color";

data() {
        return {
            pullToRefreshStyle: {
                indicatorColor: new colorModule.Color("red"),
                indicatorBackgroundColor: new colorModule.Color("green")
            }
        };
}