本文介绍了如何使用Flutter FutureBuilder构建Dropdownmenu的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想在Flutter中使用FutureBuilder构建下拉菜单,因为我正在从API获取json,我是flutter中的新手,所以我尝试了但我做不到这是我的代码
hi i want to build dropdown menu using FutureBuilder in Flutter because i'm fetching json from API, I'm new in flutter so i tried and i could not do it here is my code
Future<Album> fetchAlbum() async { final response = await http.get( 'vpic.nhtsa.dot.gov/api/vehicles/getmodelsformake/honda?format=json'); if (response.statusCode == 200) { return Album.fromJson(jsonDecode(response.body)); } else { throw Exception('Failed to load album'); } } class Album { int count; String message; String searchCriteria; List<Results> results; Album({this.count, this.message, this.searchCriteria, this.results}); Album.fromJson(Map<String, dynamic> json) { count = json['Count']; message = json['Message']; searchCriteria = json['SearchCriteria']; if (json['Results'] != null) { results = new List<Results>(); json['Results'].forEach((v) { results.add(new Results.fromJson(v)); }); } } } class Results { int makeID; String makeName; int modelID; String modelName; Results({this.makeID, this.makeName, this.modelID, this.modelName}); Results.fromJson(Map<String, dynamic> json) { makeID = json['Make_ID']; makeName = json['Make_Name']; modelID = json['Model_ID']; modelName = json['Model_Name']; } }我想为所有modelID建立一个DropDownMenuList
i want to build a DropDownMenuList for all modelID
谢谢
推荐答案您可以在下复制粘贴运行完整代码代码段
You can copy paste run full code below code snippet
FutureBuilder( future: _future, builder: (context, AsyncSnapshot<Album> snapshot) { switch (snapshot.connectionState) { case ConnectionState.none: return Text('none'); case ConnectionState.waiting: return Center(child: CircularProgressIndicator()); case ConnectionState.active: return Text(''); case ConnectionState.done: if (snapshot.hasError) { return Text( '${snapshot.error}', style: TextStyle(color: Colors.red), ); } else { return DropdownButton<Results>( isExpanded: true, items: snapshot.data.results.map((Results dropDownStringItem) { return DropdownMenuItem<Results>( value: dropDownStringItem, child: Text(dropDownStringItem.modelID.toString()), ); }).toList(), onChanged: (value) { setState(() { _selected = value; }); }, value: _selected, ); } } })工作演示
完整代码
import 'dart:convert'; import 'package:flutter/material.dart'; import 'package:http/http.dart' as http; class Album { int count; String message; String searchCriteria; List<Results> results; Album({this.count, this.message, this.searchCriteria, this.results}); Album.fromJson(Map<String, dynamic> json) { count = json['Count']; message = json['Message']; searchCriteria = json['SearchCriteria']; if (json['Results'] != null) { results = []; json['Results'].forEach((v) { results.add(new Results.fromJson(v)); }); } } } class Results { int makeID; String makeName; int modelID; String modelName; Results({this.makeID, this.makeName, this.modelID, this.modelName}); Results.fromJson(Map<String, dynamic> json) { makeID = json['Make_ID']; makeName = json['Make_Name']; modelID = json['Model_ID']; modelName = json['Model_Name']; } } void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: MyHomePage(title: 'Flutter Demo Home Page'), ); } } class MyHomePage extends StatefulWidget { MyHomePage({Key key, this.title}) : super(key: key); final String title; @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State<MyHomePage> { Future<Album> _future; Results _selected; Future<Album> fetchAlbum() async { final response = await http.get( 'vpic.nhtsa.dot.gov/api/vehicles/getmodelsformake/honda?format=json'); if (response.statusCode == 200) { return Album.fromJson(jsonDecode(response.body)); } else { throw Exception('Failed to load album'); } } @override void initState() { _future = fetchAlbum(); super.initState(); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), body: FutureBuilder( future: _future, builder: (context, AsyncSnapshot<Album> snapshot) { switch (snapshot.connectionState) { case ConnectionState.none: return Text('none'); case ConnectionState.waiting: return Center(child: CircularProgressIndicator()); case ConnectionState.active: return Text(''); case ConnectionState.done: if (snapshot.hasError) { return Text( '${snapshot.error}', style: TextStyle(color: Colors.red), ); } else { return DropdownButton<Results>( isExpanded: true, items: snapshot.data.results.map((Results dropDownStringItem) { return DropdownMenuItem<Results>( value: dropDownStringItem, child: Text(dropDownStringItem.modelID.toString()), ); }).toList(), onChanged: (value) { setState(() { _selected = value; }); }, value: _selected, ); } } }), ); } }更多推荐
如何使用Flutter FutureBuilder构建Dropdownmenu
发布评论