我在使用flutter在实时数据库的相关下拉列表中显示数据时出错


import 'package:flutter/material.dart';
import 'package:firebase_database/firebase_database.dart';
class homepg extends StatelessWidget {
const homepg({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("home"),
),
body: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var ref = FirebaseDatabase.instance.ref();
var _selectedexam;
var _selectedsemester;
var _selectedcourse;
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.all(15),
child: Center(
child: Column(
children: <Widget>[
Row(
children: [
const Align(
alignment: Alignment.centerLeft,
child: Text(
"Exam ",
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
),
),
const SizedBox(
width: 40,
),
Container(
width: 400,
child: FutureBuilder(
future: ref.child("/Exam").get(),
builder:
(context, AsyncSnapshot<DataSnapshot> asyncSnapshot) {
if (asyncSnapshot.hasError)
return Text("Error: ${asyncSnapshot.error}");
if (!asyncSnapshot.hasData)
return const CircularProgressIndicator();
return DropdownButton<String>(
isExpanded: true,
items: asyncSnapshot.data!.children
.map((snap) => DropdownMenuItem(
value: snap.key,
child: Text(snap.key.toString())))
.toList(),
value: _selectedexam,
onChanged: (String? newValue) {
setState(() {
_selectedexam = newValue!;
print(_selectedexam);
});
},
);
}),
),
],
),
const SizedBox(
height: 100,
),
Row(
children: [
const Align(
alignment: Alignment.centerLeft,
child: Text(
"Semester",
style:
TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
)),
const SizedBox(
width: 20,
),
Container(
width: 400,
child: FutureBuilder(
future: ref.child("/Exam/$_selectedexam").get(),
builder:
(context, AsyncSnapshot<DataSnapshot> asyncSnapshot) {
if (asyncSnapshot.hasError)
return Text("Error: ${asyncSnapshot.error}");
if (!asyncSnapshot.hasData)
return const CircularProgressIndicator();
return DropdownButton<String>(
isExpanded: true,
items: asyncSnapshot.data!.children
.map((snap) => DropdownMenuItem(
value: snap.key,
child: Text(snap.key.toString())))
.toList(),
value: _selectedsemester,
onChanged: (String? newValue) {
setState(() {
//_selectedexam = null;
_selectedsemester = newValue!;
print(_selectedsemester);
});
},
);
}),
),
],
),
const SizedBox(
height: 100,
),
Row(
children: [
const Align(
alignment: Alignment.centerLeft,
child: Text(
"Course",
style:
TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
)),
const SizedBox(
width: 40,
),
Container(
width: 400,
child: FutureBuilder(
future: ref
.child("/Exam/$_selectedexam/$_selectedsemester")
.get(),
builder:
(context, AsyncSnapshot<DataSnapshot> asyncSnapshot) {
if (asyncSnapshot.hasError)
return Text("Error: ${asyncSnapshot.error}");
if (!asyncSnapshot.hasData)
return const CircularProgressIndicator();
return DropdownButton<String>(
isExpanded: true,
items: asyncSnapshot.data!.children
.map((snap) => DropdownMenuItem(
value: snap.key,
child: Text(snap.key.toString())))
.toList(),
value: _selectedcourse,
onChanged: (String? newValue) {
setState(() {
_selectedcourse = newValue!;
print(_selectedcourse);
});
},
);
}),
),
],
),
],
),
),
);

}}

这是完整的代码。我想在一个依赖的下拉列表中显示数据,但我遇到了错误,请告诉我如何解决它。在第一个下拉列表中,我显示考试(春季和秋季(,如果用户点击春季,它会在另一个下拉列表显示相关学期。它第一次工作很好,但当我更改下拉值时显示错误,谢谢

下拉结构

更改第一个下降值后的错误图像

我看到的是,当您选择了第一个下拉列表,并在此基础上选择了第二个下拉列表。现在您更改了第一个下拉列表,第二个下拉列表将出现错误。为此,您必须在代码中执行以下操作。

FutureBuilder (
future: ref.child("/Exam/$_selectedexam").get(),
builder: (context, AsyncSnapshot<DataSnapshot> asyncSnapshot) {
if (asyncSnapshot.hasError)
return Text("Error: ${asyncSnapshot.error}");
if (!asyncSnapshot.hasData)
return const CircularProgressIndicator();
return DropdownButton<String> (
items: asyncSnapshot.data!.children
.map((snap) => DropdownMenuItem(
value: snap.key, child: Text(snap.key.toString())))
.toList(),
value: _selectedsemester,
onChanged: (String? newValue) {
setState(() {
_selectedexam = null;/*or you can check this as well _selectedexam = '';  */ // make it null for empty
_selectedsemester = newValue!;
print(_selectedsemester);
});
},
);
}),

你可以检查一下,让我知道它是否适合你。

最终解决方案:主要原因是当项目被更改时,依赖下拉列表应该被购买到初始状态。

最新更新