使用Load More包遇类型不匹配及页面无内容问题求助

一、类型不匹配错误修复 #

你的list是List<Topics>类型，但List.generate(30, (v) => v)返回的是List<int>，直接调用addAll会触发类型不兼容错误。需要在生成列表时创建Topics实例：

修改initState和load方法中的列表生成逻辑：

@override
void initState() {
  super.initState();
  // 生成Topics实例，用索引值构造id和title
  list.addAll(List.generate(30, (v) => Topics(id: v + 1, title: "话题 ${v + 1}")));
}

void load() {
  print("load");
  setState(() {
    // 基于现有列表长度生成新id，避免重复
    final startId = list.length + 1;
    list.addAll(List.generate(15, (v) => Topics(id: startId + v, title: "话题 ${startId + v}")));
    print("data count = ${list.length}");
  });
}

二、模拟器无内容显示修复 #

1. Topics类未重写toString：默认toString()只会打印实例内存地址，导致列表项显示无意义内容。可以通过两种方式解决：

   • 重写Topics的toString方法：

     class Topics {
       final int id;
       final String title;
       
       Topics({
         required this.id,
         required this.title,
       });
       
       factory Topics.fromJson(Map<String, dynamic> json) {
         return Topics(
           id: json['id'] as int,
           title: json['title'] as String,
         );
       }
     
       // 重写toString，返回要显示的内容
       @override
       String toString() {
         return title;
       }
     }
     

   • 直接在列表项中访问title属性：

     itemBuilder: (BuildContext context, int index) {
       return Container(
         child: Text(list[index].title), // 直接显示title字段
         height: 40.0,
         alignment: Alignment.center,
       );
     },
     

2. 优化刷新逻辑：原_refresh方法清空列表后调用load()，会导致刷新后仅加载15条数据，不符合预期。调整为重新加载初始30条：

Future<void> _refresh() async {
  await Future.delayed(Duration(milliseconds: 2000));
  setState(() {
    list.clear();
    list.addAll(List.generate(30, (v) => Topics(id: v + 1, title: "话题 ${v + 1}")));
  });
}

完整修改后的代码 #

Topics类 #

class Topics {
  final int id;
  final String title;
  
  Topics({
    required this.id,
    required this.title,
  });
  
  factory Topics.fromJson(Map<String, dynamic> json) {
    return Topics(
      id: json['id'] as int,
      title: json['title'] as String,
    );
  }

  @override
  String toString() {
    return title;
  }
}

MyHomePage类 #

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key, this.title}) : super(key: key);
  final String? title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int get count => list.length;

  List<Topics> list = [];

  @override
  void initState() {
    super.initState();
    list.addAll(List.generate(30, (v) => Topics(id: v + 1, title: "话题 ${v + 1}")));
  }

  void load() {
    print("load");
    setState(() {
      final startId = list.length + 1;
      list.addAll(List.generate(15, (v) => Topics(id: startId + v, title: "话题 ${startId + v}")));
      print("data count = ${list.length}");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title ?? "Load More Demo"),
      ),
      body: RefreshIndicator(
        child: LoadMore(
          isFinish: count >= 60,
          onLoadMore: _loadMore,
          child: ListView.builder(
            itemBuilder: (BuildContext context, int index) {
              return Container(
                child: Text(list[index].toString()),
                height: 40.0,
                alignment: Alignment.center,
              );
            },
            itemCount: count,
          ),
          whenEmptyLoad: false,
          delegate: DefaultLoadMoreDelegate(),
          textBuilder: DefaultLoadMoreTextBuilder.chinese,
        ),
        onRefresh: _refresh,
      ),
    );
  }

  Future<bool> _loadMore() async {
    print("onLoadMore");
    await Future.delayed(Duration(milliseconds: 2000));
    load();
    return true;
  }

  Future<void> _refresh() async {
    await Future.delayed(Duration(milliseconds: 2000));
    setState(() {
      list.clear();
      list.addAll(List.generate(30, (v) => Topics(id: v + 1, title: "话题 ${v + 1}")));
    });
  }
}

内容的提问来源于stack exchange，提问作者user19660174