在DataTable中單擊時未安裝Flutter應用程式狀態（setState）

每當我在 DataRow 中單擊并嘗試 setState() 時，顯然未安裝主應用程式狀態。如果有人能指出我為什么會發生這種情況的正確方向，我將不勝感激。在 DataTable 中單擊后，我真的需要能夠更新應用程式 (setState)。

示例代碼：

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  setState(fn){
    if (mounted) {
      super.setState(fn);
    } else {
      debugPrint('Not mounted');
    }
  }

  update() => setState((){});

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        title: const Text('Flutter Demo'),
      ),
      body: PaginatedDataTable(
        showCheckboxColumn: true,
        columns: const <DataColumn>[
          DataColumn(
            label: Expanded(
              child: Text(
                'Name',
                style: TextStyle(fontStyle: FontStyle.italic),
              ),
            ),
          ),
          DataColumn(
            label: Expanded(
              child: Text(
                'Age',
                style: TextStyle(fontStyle: FontStyle.italic),
              ),
            ),
          ),
          DataColumn(
            label: Expanded(
              child: Text(
                'Role',
                style: TextStyle(fontStyle: FontStyle.italic),
              ),
            ),
          ),
        ],
        source: MyDataTableSource(),
      ),
    );
  }
}

class MyDataTableSource extends DataTableSource {
  @override
  DataRow getRow(int index) {
    return DataRow.byIndex(
      index: index,
      cells: <DataCell>[
        DataCell(GestureDetector(
          onTap: () => _MyHomePageState().update(),
          child: const Text('Sarah'),
        )),
        DataCell(GestureDetector(
          onTap: () => _MyHomePageState().update(),
          child: const Text('19'),
        )),
        DataCell(GestureDetector(
          onTap: () => _MyHomePageState().update(),
          child: const Text('Student'),
        )),
      ],
    );
  }

  @override
  bool get isRowCountApproximate => false;

  @override
  int get rowCount => 3;

  @override
  int get selectedRowCount => 0;
}

uj5u.com熱心網友回復：

您在新的狀態參考上觸發 .update() 。使用適當的狀態管理，否則您將被迫使用 setState 像這樣使用“Key”

import 'package:flutter/material.dart';

GlobalKey<MyHomePageState> myHomePageKey = GlobalKey<MyHomePageState>();

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return  MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(key:myHomePageKey),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => MyHomePageState();
}

class MyHomePageState extends State<MyHomePage> {

  @override
  setState(fn){
    if (mounted) {
      super.setState(fn);
    } else {
      debugPrint('Not mounted');
    }
  }

  update() => setState((){});

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        title: const Text('Flutter Demo'),
      ),
      body: PaginatedDataTable(
        showCheckboxColumn: true,
        columns: const <DataColumn>[
          DataColumn(
            label: Expanded(
              child: Text(
                'Name',
                style: TextStyle(fontStyle: FontStyle.italic),
              ),
            ),
          ),
          DataColumn(
            label: Expanded(
              child: Text(
                'Age',
                style: TextStyle(fontStyle: FontStyle.italic),
              ),
            ),
          ),
          DataColumn(
            label: Expanded(
              child: Text(
                'Role',
                style: TextStyle(fontStyle: FontStyle.italic),
              ),
            ),
          ),
        ],
        source: MyDataTableSource(),
      ),
    );
  }
}

class MyDataTableSource extends DataTableSource {
    
  @override
  DataRow getRow(int index) {
    return DataRow.byIndex(
      index: index,
      cells: <DataCell>[
        DataCell(GestureDetector(
          onTap: () => myHomePageKey.currentState!.update(),
          child: const Text('Sarah'),
        )),
        DataCell(GestureDetector(
          onTap: () => myHomePageKey.currentState!.update(),
          child: const Text('19'),
        )),
        DataCell(GestureDetector(
          onTap: () => myHomePageKey.currentState!.update(),
          child: const Text('Student'),
        )),
      ],
    );
  }

  @override
  bool get isRowCountApproximate => false;

  @override
  int get rowCount => 3;

  @override
  int get selectedRowCount => 0;
}

標籤：扑分页数据表颤振数据表

上一篇：如何將小部件引數用作變數？

下一篇：Flutter中SimpleDialog中ListView的錯誤