Flutter，如何从返回的 Widget 调用 Stateful Widget 内部的函数？

Question

我想将我的脚手架分解成更小的部分以便于阅读。 我将小部件分成功能并返回到脚手架树。 但是我不知道如何使用在需要 setState UI 的有状态小部件中声明的函数。

我的部分代码：

Future<List<dataRecord>>? dataList;

class _clientDetailState extends State<clientDetail> {
  @override
  void initState() {
    super.initState();
  }

  List<dataRecord> parseJson(String responseBody) {
    final parsed =
        convert.jsonDecode(responseBody).cast<Map<String, dynamic>>();
    return parsed.map<dataRecord>((json) => dataRecord.fromJson(json)).toList();
  }

  Future<List<dataRecord>> fetchData(http.Client client) async {
    final response = await client
        .get(Uri.parse('test.php'));
    return parseJson(response.body);
  }

  Body: myButton,
        ListView,

Widget myButton() {
  return TextButton(
    child: Text('test'),
    onTap: () {
      dataList = fetchData(http.Client());   //Method not found
    },
}

Answer 1

这是简单的方法

class ClientDetail extends StatefulWidget {
  const ClientDetail({Key? key}) : super(key: key);

  @override
  State<ClientDetail> createState() => _ClientDetailState();
}

class _ClientDetailState extends State<ClientDetail> {

  List<dataRecord> dataList = [];

  @override
  Widget build(BuildContext context) {
    return ListView(
  children: [
      myButton(),
      ...dataList.map((e) => Text(e)).toList(),
     ],
    );
  }

  List<dataRecord> parseJson(String responseBody) {
    final parsed =
        convert.jsonDecode(responseBody).cast<Map<String, dynamic>>();
    return parsed.map<dataRecord>((json) => dataRecord.fromJson(json)).toList();
  }

  Future<List<dataRecord>> fetchData(http.Client client) async {
    final response = await client.get(Uri.parse('test.php'));
    return parseJson(response.body);
  }

  Widget myButton() {
    return TextButton(
        child: const Text('test'),
        onPressed: () async {
          setState(() async {
            dataList = await fetchData(http.Client());
          });
        });
  }
}

提示：始终以大写字母开头类名，例如ClientDetail而不是clienDetail也DataRecord而不是dataRecord

问候

Answer 2

您可以将您的实际函数作为参数传递给小部件的函数，然后直接从状态调用它；

Body: myButton(onPressed: () => fetchData(http.Client())),
ListView,

Widget myButton({required void Function()? onPressed}) {
  return TextButton(
    child: Text('test'),
    onPressed: onPressed,
  );
}