要实现下拉刷新和上拉加载要了解以下几点：
1.onPullDownRefresh()
监听用户下拉刷新事件
a.需要在全局配置的 window 选项中或页面配置中开启enablePullDownRefresh
b.可以通过 Taro.startPullDownRefresh 触发下拉刷新，调用后触发下拉刷新动画，效果与用户手动下拉刷新一致。
c.当处理完数据刷新后，Taro.stopPullDownRefresh 可以停止当前页面的下拉刷新
2.onReachBottom()
监听用户上拉触底事件
a.可以在全局配置的 window 选项中或页面配置中设置触发距离 onReachBottomDistance
b.在触发距离内滑动期间，本事件只会被触发一次
3.enablePullDownRefresh、backgroundTextStyle、onReachBottomDistance

更多内容请查看官方文档：https://taro-docs.jd.com/taro/docs/README.html
实现思路：
1.下拉刷新
配置好各项之后，在生命周期**onPullDownRefresh()中监听下拉事件，在这里实现刷新的动作
2.上拉加载
在生命周期onReachBottom()**中监听上拉触底事件（注意，只有滚动条滚动到最底部，这个事件才会被触发），在这里实现刷新动作

代码如下：

import Taro, { Component } from "@tarojs/taro";
import { AtActivityIndicator } from "taro-ui";
import { View } from "@tarojs/components";

// i用来判断是第几页，主要用来控制一页显示的数据
let i = 1;
class DemoList extends Component {
  constructor(props) {
    super(props);
    this.state = {
    // 控制活动指示器，也就是加载的小圆圈的显示隐藏，默认隐藏，上拉加载的
    //时候显示出来设置为true，加载完成后隐藏设置为false
      showActivity: false 
    };
  }
  componentDidMount() {
	this.getData();
  }
  // 监听下拉刷新
  onPullDownRefresh() {
    i = 1;
    this.getData();
  }
  // 监听上拉触底
  onReachBottom() {
    i++;
    this.setState({
      showActivity: true
    });
    this.getData();
  }

  // 配置项
  config = {
    navigationBarTitleText: "列表",
    enablePullDownRefresh: true,
    backgroundTextStyle: "dark",
    onReachBottomDistance: 50,
  };
  // 从服务器获取列表数据，要看具体的业务逻辑
  getData() {
    const { dispatchLoadList } = this.props;
    let newBoy = [
      "pageindex=" + page,
      "pagesize=" + i * 10 // 通过i计算出pagesize大小
    ];
    dispatchLoadList(newBoy).then(json => {
       if (requestSuccessNoT(json)) {
         // 这里是成功的业务逻辑
         // ......
         // 加载成功 设置showActivity为false
         this.setState({ showActivity: false });
       } else {
         // 这里是失败的业务逻辑
       }
    })
  }
  /**
   * 活动指示器
   * 这里用Taro UI的活动指示器来实现上拉加载的动画效果
   */
  ActivityIndicator() {
    return (
      <View style={{ display: 'flex', justifyContent: 'center', paddingTop: '10px', paddingBottom: '10px' }}>
        <AtActivityIndicator></AtActivityIndicator>
      </View>
    );
  }
  render() {
    const { showActivity } = this.state;
    return(
	  <View>
		<View>
		  //这里是你的列表
		</View>
		// 活动指示器，当showActivity为true时显示出来
		{showActivity && this.ActivityIndicator()}
	  </View>
	);
  }
}
const mapDispatchToProps = dispatch => ({
  dispatchLoadList: values => dispatch(shopList(values))
});

export default connect(null, mapDispatchToProps)(DemoList);