miniapp/src/components/ScrollPage/index.jsx

import React, { useState } from 'react'
import '@/assets/css/reset.less'
import '@/assets/css/iconfont.less'
import './index.less'

export default function ScrollPage (props) {

  const { IsPullDown = false, IsPullUp = false, HasMore = true, OnRefresh = () => { }, OnPullUp = () => { } } = props

  return (
    <view className='ScrollPage'>
      <scroll-view scroll-y='true' style='height: 100%;' refresher-enabled={true} onrefresherrefresh={OnRefresh} onscrolltolower={OnPullUp} refresher-triggered={IsPullDown} refresher-background='none'>
        <view className='ScrollPageContent'>
          {
            props.children
          }
          <view className='ScrollPageBottom'></view>
        </view>
        <text className='LoadMoreText'>{IsPullUp ? '正在加载更多...' : HasMore ? '上拉加载更多' : '已经到底了~'}</text>
      </scroll-view>
    </view>
  )
}