loại 'Danh sách <dynamic>' không phải là một loại phụ của loại 'Danh sách <Mục tiêu>'

Tôi có một đoạn mã mà tôi đã sao chép từ ví dụ Firestore:

Widget _buildBody(BuildContext context) {
    return new StreamBuilder(
      stream: _getEventStream(),
      builder: (context, snapshot) {
        if (!snapshot.hasData) return new Text('Loading...');
        return new ListView(
          children: snapshot.data.documents.map((document) {
            return new ListTile(
              title: new Text(document['name']),
              subtitle: new Text("Class"),
            );
          }).toList(),
        );
      },
    );
  }

Nhưng tôi gặp lỗi này

type 'List<dynamic>' is not a subtype of type 'List<Widget>'

Có gì sai ở đây?

Vấn đề ở đây là kiểu suy luận không thành công theo cách không mong muốn. Giải pháp là cung cấp một đối số kiểu cho mapphương thức.

snapshot.data.documents.map<Widget>((document) {
  return new ListTile(
    title: new Text(document['name']),
    subtitle: new Text("Class"),
  );
}).toList()

Câu trả lời phức tạp hơn là trong khi loại childrenlà List<Widget>như vậy, thông tin đó không chảy ngược về phía maplời gọi. Điều này có thể là do mapđược theo sau bởi toListvà bởi vì không có cách nào để nhập chú thích trả về của một bao đóng.

Bạn có thể Truyền Danh sách động sang Danh sách Với Loại cụ thể:

List<'YourModel'>.from(_list.where((i) => i.flag == true));

Tôi đã giải quyết vấn đề của mình bằng cách chuyển đổi MapthànhWidget

      children: snapshot.map<Widget>((data) => 
               _buildListItem(context, data)).toList(),

Tôi nghĩ rằng bạn sử dụng _buildBody trong thuộc tính con của một số widget, vì vậy trẻ em mong đợi một List Widget (mảng Widget) và _buildBody trả về một 'Danh sách động' .

Theo một cách rất đơn giản, bạn có thể sử dụng một biến để trả về nó:

// you can build your List of Widget's like you need
List<Widget> widgets = [
  Text('Line 1'),
  Text('Line 2'),
  Text('Line 3'),
];

// you can use it like this
Column(
  children: widgets
)

Ví dụ ( flaming tạo test1 ; cd test1 ; chỉnh sửa lib / main.dart ; chạy rung ):

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  List<Widget> widgets = [
    Text('Line 1'),
    Text('Line 2'),
    Text('Line 3'),
  ];

  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text("List of Widgets Example")),
        body: Column(
          children: widgets
        )
      )
    );
  }

}

Một ví dụ khác sử dụng một Widget (oneWidget) trong Danh sách các Widget (arrayOfWidgets). Tôi chỉ ra cách mở rộng một tiện ích (MyButton) để cá nhân hóa một tiện ích và giảm kích thước mã:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  List<Widget> arrayOfWidgets = [
    Text('My Buttons'),
    MyButton('Button 1'),
    MyButton('Button 2'),
    MyButton('Button 3'),
  ];

  Widget oneWidget(List<Widget> _lw) { return Column(children: _lw); }

  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text("Widget with a List of Widget's Example")),
        body: oneWidget(arrayOfWidgets)
      )
    );
  }

}

class MyButton extends StatelessWidget {
  final String text;

  MyButton(this.text);

  @override
  Widget build(BuildContext context) {
    return FlatButton(
      color: Colors.red,
      child: Text(text),
      onPressed: (){print("Pressed button '$text'.");},
    );
  }
}

Tôi đã làm một ví dụ hoàn chỉnh rằng tôi sử dụng các widget động để hiển thị và ẩn các widget trên màn hình, bạn cũng có thể thấy nó chạy trực tuyến trên dart fiddle .

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  List item = [
    {"title": "Button One", "color": 50},
    {"title": "Button Two", "color": 100},
    {"title": "Button Three", "color": 200},
    {"title": "No show", "color": 0, "hide": '1'},
  ];

  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text("Dynamic Widget - List<Widget>"),backgroundColor: Colors.blue),
        body: Column(
          children: <Widget>[
            Center(child: buttonBar()),
            Text('Click the buttons to hide it'),
          ]
        )
      )
    );
  }

  Widget buttonBar() {
    return Column(
      children: item.where((e) => e['hide'] != '1').map<Widget>((document) {
        return new FlatButton(
          child: new Text(document['title']),
          color: Color.fromARGB(document['color'], 0, 100, 0),
          onPressed: () {
            setState(() {
              print("click on ${document['title']} lets hide it");
              final tile = item.firstWhere((e) => e['title'] == document['title']);
              tile['hide'] = '1';
            });
          },
        );
      }
    ).toList());
  }
}

Có thể nó sẽ giúp ai đó. Nếu nó hữu ích cho bạn, vui lòng cho tôi biết bằng cách nhấp vào mũi tên lên. Cảm ơn.

https://dartpad.dev/b37b08cc25e0ccdba680090e9ef4b3c1

Điều này phù hợp với tôiList<'YourModel'>.from(_list.where((i) => i.flag == true));

Để chuyển đổi mỗi mục thành một tiện ích con, hãy sử dụng hàm tạo ListView.builder ().

Nói chung, hãy cung cấp hàm trình tạo để kiểm tra loại mặt hàng bạn đang xử lý và trả về tiện ích con thích hợp cho loại mặt hàng đó.

ListView.builder(
  // Let the ListView know how many items it needs to build.
  itemCount: items.length,
  // Provide a builder function. This is where the magic happens.
  // Convert each item into a widget based on the type of item it is.
  itemBuilder: (context, index) {
    final item = items[index];

    return ListTile(
      title: item.buildTitle(context),
      subtitle: item.buildSubtitle(context),
    );
  },
);