I make small app to display data of user from api. Now I try to pass data of FutureBuilder to another page but I get this error each time:

The argument type 'List<AllProductModel>' can't be assigned to the parameter type 'AllProductModel'.

Frist page as:

class UserNetworkPage extends StatelessWidget {

  @override
  Widget build(BuildContext context) => Scaffold(
        body: FutureBuilder<List<AllProductModel>>(
          future: UsersApi.getUsers(),
          builder: (context, snapshot) {
            final ListDataDisplay = snapshot.data;

            switch (snapshot.connectionState) {
              case ConnectionState.waiting:
                return Center(child: CircularProgressIndicator());
              default:
                if (snapshot.hasError) {
                  return Center(child: Text('Some error occurred!'));
                } else {
                  return UserPage(user:ListDataDisplay);//here I need to send this
                }
            }
          },
        ),
      );
}

Then second page as:

class UserPage extends StatefulWidget {
  final AllProductModel ListDataDisplay;

   UserPage({Key key,this.ListDataDisplay,}) : super(key: key);

  @override
  State<UserPage> createState() => _UserPageState();
}

class _UserPageState extends State<UserPage> {
  @override
  void initState() {
    super.initState();
    print(widget.ListDataDisplay);
  }
  @override
  Widget build(BuildContext context) => Scaffold(
      
      );
}

Also data model:

class AllProductModel {
  final String username;

  const AllProductModel({
    @required this.username,

  });

  static AllProductModel fromJson(json) => AllProductModel(
        username: json['username'],
   
      );
}

Api Code:

class UsersApi {
  static Future<List<AllProductModel>> getUsers() async {
    final url =
        'https://**************';
    final response = await http.get(url);
    final body = json.decode(response.body);

    return body.map<AllProductModel>(AllProductModel.fromJson).toList();
  }
  
}

Is my code wrong or is there a different way to solve this problem? Can anyone help me.

thank you.

CodePudding user response：

In your UserPage class you are accepting just a single AllProductModel. So change your UserPage class to this:

 class UserPage extends StatefulWidget {
  final List<AllProductModel> ListDataDisplay;

   UserPage({Key key,this.ListDataDisplay,}) : super(key: key);

  @override
  State<UserPage> createState() => _UserPageState();
}

and then use it like this:

switch (snapshot.connectionState) {
              case ConnectionState.waiting:
                return Center(child: CircularProgressIndicator());
              default:
                if (snapshot.hasError) {
                  return Center(child: Text('Some error occurred!'));
                } else {
                  return UserPage(ListDataDisplay:ListDataDisplay);
                }
            }

And you can use the list like this in UserPage class:

@override
  Widget build(BuildContext context) => Scaffold(
      body: ListView.builder(
        itemCount: widget.ListDataDisplay.length,
        itemBuilder: (context, index) {
          return Text(widget.ListDataDisplay[index].username);
        },
      ),
 );