如何将flutter函数变成无状态类？答案

【问题标题】：How to turn a flutter function into a stateless class?如何将flutter函数变成无状态类？
【发布时间】：2020-08-04 04:46:05
【问题描述】：

我正在关注 Angela Yu 的 Flutter 初学者教程，但我不知道如何将函数转换为无状态类并在小部件中使用它。

我之前用一个简单的 Container 或 Column 做过，但是通过下面的例子我无法理解这个概念：

class _PriceScreenState extends State<PriceScreen> {
  String selectedCurrency = 'USD';

  List<DropdownMenuItem> getDropdownItems() {
    List<DropdownMenuItem<String>> dropdownItems = [];

    for (String currency in currenciesList) {
      var newItem = DropdownMenuItem(
        child: Text(currency),
        value: currency,
      );
      dropdownItems.add(newItem);
    }
    return dropdownItems;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: DropdownButton<String>(
            value: selectedCurrency,
            items: getDropdownItems(),
            onChanged: (value) {
              setState(() {
                selectedCurrency = value;
              });
            }),
      ),
    );
  }
}

如何将函数 getDropdownItems() 转换为单独的无状态类并在小部件中使用它？

谢谢。

【问题讨论】：

标签： function flutter widget

【解决方案1】：

这个想法不是将List<DropdownMenuItem> 变成StatelessWidget，而是为列表项制作一个无状态的小部件

这是一个改变的问题

DropdownButton<String>(
  value: selectedCurrency,
  items: [
    for (String currency in currenciesList)
      DropdownMenuItem(
        child: Text(currency),
        value: currency,
      ),
  ],
  onChanged: (value) {
    setState(() {
      selectedCurrency = value;
    });
  },
),

进入：

DropdownButton<String>(
  value: selectedCurrency,
  items: [
    for (String currency in currenciesList)
      MyStatelessWidget(currency: currency),
  ],
  onChanged: (value) {
    setState(() {
      selectedCurrency = value;
    });
  },
),

...

class MyStatelessWidget extends StatelessWidget {
  const MyStatelessWidget({Key key, this.currency}) : super(key: key);

  final String currency;

  @override
  Widget build(BuildContext context) {
    return DropdownMenuItem(
      value: currency,
      child: Text(currency),
    );
  }
}

【讨论】：