Question

我希望能够生成一个下拉菜单来选择值，我确保所有内容都是有状态的，但Setstate仍然不喜欢它。

尝试将其包装在不同的小部件中或使用不同的下拉属性。看起来还是不想工作。

class DicePage extends StatefulWidget {
  @override

  _DicePageState createState() => new _DicePageState();
}

class _DicePageState extends State<DicePage> {
  @override

  Widget build(BuildContext ctxt) {
    return Scaffold(
      appBar: AppBar(
      ),
      body: BodyLayout(),
    );
  }
}

class BodyLayout extends StatefulWidget {
  BodyLayout({Key key}) : super(key: key);

  @override
  _BodyLayoutState createState()=> _BodyLayoutState();
}

class _BodyLayoutState extends State<BodyLayout> {
  @override
  Widget build(BuildContext ctxt) {
    return _myListView(ctxt);
  }
}




Widget _myListView(BuildContext ctxt) {

  final List<String> entries = <String>['A','B','C'];
  final List<int> colorCodes = <int>[600, 500, 100];

  return ListView.separated(
    padding: const EdgeInsets.all(8.0),
    itemCount: entries.length,
    itemBuilder: (BuildContext ctxt, int index) {
      return Container(
        height: 150,
        color: Colors.amber[colorCodes[index]],
        child: new Row(
          mainAxisAlignment: MainAxisAlignment.start,
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            new SingleChildScrollView(
              child: DropdownButton<String>(
              value: dropdownValue,
              onChanged: (String newValue) {
                setState(() {
                  dropdownValue = newValue;
                });
              },
              items: <String>['1','2','3','4','5','6','7','8','9','10']
              .map<DropdownMenuItem<String>>((String value) {
                return DropdownMenuItem<String>(
                  value: value,
                  child: Text(value),
                );
              }).toList(),
            ),
            ),
            new Container(
              padding: const EdgeInsets.all(20),
              child: new MaterialButton(
              onPressed: () {},
              child: Text('2'),
              ),
            ),
            new Container(
              padding: const EdgeInsets.all(20),
              child: new IconButton(
                iconSize: 80,
                onPressed: () {},
                icon: Icon(Icons.casino),
              ),
            ),
          ],
        )
      );
    },
    separatorBuilder: (BuildContext ctxt, int index) => const Divider(),
  );
}

预期它会在单击按钮时生成列出的下拉菜单。

Answer 1

尝试你的代码，它实际上会得到错误：

<块引用>

未定义函数“setState”。

如果在外部调用 setState，flutter 将无法识别应该更新哪个状态。

您应该在 _myListView 类中有 BodyLayout 方法，因为这与状态有关。

这是一个更新的代码：

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
    );
  }
}

class DicePage extends StatefulWidget {
  @override
  _DicePageState createState() => new _DicePageState();
}

class _DicePageState extends State<DicePage> {
  @override
  Widget build(BuildContext ctxt) {
    return Scaffold(
      appBar: AppBar(),
      body: BodyLayout(),
    );
  }
}

class BodyLayout extends StatefulWidget {
  BodyLayout({Key key}) : super(key: key);
  @override
  _BodyLayoutState createState() => _BodyLayoutState();
}

class _BodyLayoutState extends State<BodyLayout> {
  String dropdownValue;

  @override
  Widget build(BuildContext ctxt) {
    return _myListView(ctxt);
  }

  Widget _myListView(BuildContext ctxt) {
    final List<String> entries = <String>['A', 'B', 'C'];
    final List<int> colorCodes = <int>[600, 500, 100];

    return ListView.separated(
      padding: const EdgeInsets.all(8.0),
      itemCount: entries.length,
      itemBuilder: (BuildContext ctxt, int index) {
        return Container(
            height: 150,
            color: Colors.amber[colorCodes[index]],
            child: new Row(
              mainAxisAlignment: MainAxisAlignment.start,
              mainAxisSize: MainAxisSize.max,
              children: <Widget>[
                new SingleChildScrollView(
                  child: DropdownButton<String>(
                    value: dropdownValue,
                    onChanged: (String newValue) {
                      setState(() {
                        dropdownValue = newValue;
                      });
                    },
                    items: <String>[
                      '1',
                      '2',
                      '3',
                      '4',
                      '5',
                      '6',
                      '7',
                      '8',
                      '9',
                      '10'
                    ].map<DropdownMenuItem<String>>((String value) {
                      return DropdownMenuItem<String>(
                        value: value,
                        child: Text(value),
                      );
                    }).toList(),
                  ),
                ),
                new Container(
                  padding: const EdgeInsets.all(20),
                  child: new MaterialButton(
                    onPressed: () {},
                    child: Text('2'),
                  ),
                ),
                new Container(
                  padding: const EdgeInsets.all(20),
                  child: new IconButton(
                    iconSize: 80,
                    onPressed: () {},
                    icon: Icon(Icons.casino),
                  ),
                ),
              ],
            ));
      },
      separatorBuilder: (BuildContext ctxt, int index) => const Divider(),
    );
  }
}

未定义功能“ setState”。飞镖/扑

1 个答案: