从下拉列表中选择并在颤振中同时更新同一列表

Question

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

                     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()),
          ]),
        ),
      ),
    );
  }
}

从下拉列表中选择并在颤振中同时更新同一列表

Selecting from a dropdown list and updating the same list the same time in flutter

list

flutter

api

dropdownbutton