> 文档中心 > HarmonyOS应用开发-下拉刷新实现

HarmonyOS应用开发-下拉刷新实现

以下为本功能的JS代码、xml和CSS代码,具体如下所示:

JS代码:

import prompt from '@system.prompt';export default {    data: { list:[], fresh:false    },    onInit() { this.list = []; for (var i = 0; i <= 2; i++) {     var item = '列表元素' + i;     this.list.push(item); }    },    refresh: function (e) { prompt.showToast({     message: '刷新中...' }) var that = this; that.fresh = e.refreshing; setTimeout(function () {     that.fresh = false;     var addItem = '更新元素';     that.list.unshift(addItem);     prompt.showToast({  message: '刷新完成!'     }) }, 2000)    }}

CSS代码:

.container {    flex-direction: column;    align-items: center;    width: 100%;    height: 100%;}.list {    width: 100%;    height: 100%;}.listitem {    width: 100%;    height: 150px;}.content {    width: 100%;    height: 100%;    flex-direction: column;    align-items: center;    justify-content: center;}.text {    font-size: 35px;    font-weight: bold;}

hml:

{{$item}}

古龙中文句子网