从下拉列表中选择并在颤动中同时更新相同的列表

Question

如何通过隐藏最初选择的问题而不出现在第二个下拉按钮中来确保用户不会两次选择相同的安全问题，反之亦然？我正在向相同的 api 提出问题的请求。 用一些代码 sn-ps 更新了问题。谢谢

                     Container(
                      height: 60,
                      width: double.infinity,
                      decoration: BoxDecoration(
                        border: Border.all(color: Colors.black, 
                      width: 1),
                        borderRadius: BorderRadius.circular(5),
                      ),
                      child: DropdownButtonHideUnderline(
                        child: DropdownButton(
                          hint: Padding(
                            padding: const EdgeInsets.only(left: 
                            20.0),
                            child: Text(
                              "Security Question Two",
                              style: TextStyle(
                                  color: Colors.black,
                                  fontSize: 16,
                                  letterSpacing: 0.3,
                                  fontWeight: FontWeight.w300),
                            ),
                          ),
                          itemHeight: 100,
                          isExpanded: true,
                          value: dropDownSecurityQuestionTwo,
                          icon: Padding(
                            padding: const EdgeInsets.only(right: 
                         10.0),
                            child: 
                         Icon(Icons.keyboard_arrow_down_outlined),
                          ),
                          iconEnabledColor: Colors.black,
                          iconSize: 30,
                          style: TextStyle(
                            color: Colors.black,
                          ),
                          items: questions.map((value) {
                            return DropdownMenuItem(
                              value: value['ID'].toString(),
                              child: Padding(
                                padding: const EdgeInsets.only(left: 
                                  20.0),
                                child: Text(
                                  value['question'].toString(),
                                ),
                              ),
                            );
                          }).toList(),
                          onChanged: (newValue) async {
                            setState(() {
                              dropDownSecurityQuestionTwo = 
                              newValue.toString();
                              print(dropDownSecurityQuestionTwo);
                              checkSelectedQuestion();
                            });
                          },
                        ),
                      ),
                    ),

               void checkSelectedQuestion(){
               List newQuestions = [];
               for(int i = 0; i<questions.length; i++){
               print(questions[i]['ID']);
               questions.removeWhere((value) => value['ID'] == 
              int.parse(dropDownSecurityQuestionOne!) );
              newQuestions.add(questions);}
                  setState(() {
                  questions = newQuestions ;
                      });}

                                                                                  

Answer 1

您可以将where 过滤器添加到items 到每个DropDownButton 的映射中，具体取决于另一个DropDownButton 的选定值。作为setState 的结果，如果在另一个DropDownButton 中选择了任何内容，则将重新创建项目。

注意：这很容易实现，但效率不高。每次都会创建和过滤项目。它适用于少量项目，但如果您想对许多项目执行类似的操作，您可能需要一种更有效的方法。例如保留两个项目列表，并且只添加/删除受影响的项目。

检查此代码并将其应用于您的案例：

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: MyPage(),
    );
  }
}

class MyPage extends StatefulWidget {
  const MyPage({Key? key}) : super(key: key);
  @override
  State<MyPage> createState() => _MyPageState();
}

class _MyPageState extends State<MyPage> {
  String? _selected1;
  String? _selected2;
  final List<String> _set = ['Alpha', 'Bravo', 'Charlie'];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: Column(children: [
            DropdownButton<String>(
                value: _selected1,
                onChanged: (String? newValue) {
                  setState(() {
                    _selected1 = newValue!;
                  });
                },
                items: _set
                    .map((value) {
                      return DropdownMenuItem<String>(
                        value: value,
                        child: Text(value),
                      );
                    })
                    .where((e) => _selected2 == null || e.value != _selected2)
                    .toList()),
            DropdownButton<String>(
                value: _selected2,
                onChanged: (String? newValue) {
                  setState(() {
                    _selected2 = newValue!;
                  });
                },
                items: _set
                    .map((String value) {
                      return DropdownMenuItem<String>(
                        value: value,
                        child: Text(value),
                      );
                    })
                    .where((e) => _selected1 == null || e.value != _selected1)
                    .toList()),
          ]),
        ),
      ),
    );
  }
}