custom_dialog 中的设置状态功能不起作用

Question

custom_dialog页面中的setState函数不起作用

在此代码中，我想显示一个客户列表，其中包含每个客户的特定数据。问题是，当我想通过显示 custom_dialog 页面中的dialog1 的浮动操作按钮添加新客户时，该客户被添加到列表中，但没有出现在页面中

主页代码：

import 'package:flutter/material.dart';
import 'package:untitled66/custom_dialog.dart';
import 'package:untitled66/customers.dart';

List<Customers> customersList = [
  Customers(
    name: 'munsef',
    itemName: 'mobile',
    price: 100,
    profit: 30,
    period: 12,
    key: UniqueKey(),
  ),
];

void main() {
  runApp(const MaterialApp(
    home: MyApp(),
  ));
}

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

  @override
  State<MyApp> createState() => MyAppState();
}

class MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          floatingActionButton: FloatingActionButton(
              child: Icon(Icons.add),
              onPressed: () {
                showDialog(
                    context: context,
                    builder: (context) {
                      return Dialog1();
                    });
              }),
          appBar: AppBar(
            title: Text('List of Items'),
            backgroundColor: Colors.lightBlue,
          ),
          body: ListView.builder(
              itemCount: customersList.length,
              itemBuilder: (element, index) {
                return InkWell(
                  child: Card(
                    child: customersList[index],
                  ),
                  onLongPress: () {
                    customersList.removeAt(index);
                    setState(() {});
                  },
                  
                );
              })),
    );
     }
     }

custome_dialog 页面：

import 'package:flutter/material.dart';
import 'package:untitled66/customers.dart';
import 'package:untitled66/main.dart';

class Dialog1 extends StatefulWidget {
  Dialog1({super.key});

  @override
  State<StatefulWidget> createState() {
    return dialog1State();
  }
}

class dialog1State extends State<Dialog1> {
  final TextEditingController customerNamecontr = TextEditingController();
  final TextEditingController itemNamecontr = TextEditingController();
  final TextEditingController pricecontr = TextEditingController();
  final TextEditingController profitcontr = TextEditingController();
  final TextEditingController periodcontr = TextEditingController();
  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text('Add customer'),
      content: Form(
          child: ListView(
        children: [
          Text("Customer's name:"),
          TextFormField(
            controller: customerNamecontr,
          ),
          Text("Item's name:"),
          TextFormField(
            controller: itemNamecontr,
          ),
          Text("Price:"),
          TextFormField(
            controller: pricecontr,
          ),
          Text("Profit:"),
          TextFormField(
            controller: profitcontr,
          ),
          Text("Period:"),
          TextFormField(
            controller: periodcontr,
          ),
        ],
      )),
      actions: [
        TextButton(
            onPressed: () {
              double? price = double.tryParse(pricecontr.text);
              int? profit = int.tryParse(profitcontr.text);
              int? period = int.tryParse(periodcontr.text);
              customersList.add(Customers(
                name: customerNamecontr.text,
                itemName: itemNamecontr.text,
                price: price!,
                profit: profit!,
                period: period!,
                key: UniqueKey(),
              ));
              setState(() {});
              Navigator.of(context).pop();
            },
            child: Text('Add'))
      ],
    );
  }
}

Answer 1

您正在对话框的上下文中调用设置状态，您需要做的是在列表视图的上下文中调用设置状态，将对话框修改为

import 'package:flutter/material.dart';
import 'package:untitled66/customers.dart';
import 'package:untitled66/main.dart';

class Dialog1 extends StatefulWidget {
    Dialog1({super.key, required this.refresh});
    final Function refresh;

  @override
  State<StatefulWidget> createState() {
    return dialog1State();
  }
}

class dialog1State extends State<Dialog1> {
  final TextEditingController customerNamecontr = TextEditingController();
  final TextEditingController itemNamecontr = TextEditingController();
  final TextEditingController pricecontr = TextEditingController();
  final TextEditingController profitcontr = TextEditingController();
  final TextEditingController periodcontr = TextEditingController();
  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text('Add customer'),
      content: Form(
          child: ListView(
        children: [
          Text("Customer's name:"),
          TextFormField(
            controller: customerNamecontr,
          ),
          Text("Item's name:"),
          TextFormField(
            controller: itemNamecontr,
          ),
          Text("Price:"),
          TextFormField(
            controller: pricecontr,
          ),
          Text("Profit:"),
          TextFormField(
            controller: profitcontr,
          ),
          Text("Period:"),
          TextFormField(
            controller: periodcontr,
          ),
        ],
      )),
      actions: [
        TextButton(
            onPressed: () {
              double? price = double.tryParse(pricecontr.text);
              int? profit = int.tryParse(profitcontr.text);
              int? period = int.tryParse(periodcontr.text);
              customersList.add(Customers(
                name: customerNamecontr.text,
                itemName: itemNamecontr.text,
                price: price!,
                profit: profit!,
                period: period!,
                key: UniqueKey(),
              ));
              widget.refresh();
              Navigator.of(context).pop();
            },
            child: Text('Add'))
      ],
    );
  }
}

并将您的 main 修改为

import 'package:flutter/material.dart';
import 'package:untitled66/custom_dialog.dart';
import 'package:untitled66/customers.dart';

List<Customers> customersList = [
  Customers(
    name: 'munsef',
    itemName: 'mobile',
    price: 100,
    profit: 30,
    period: 12,
    key: UniqueKey(),
  ),
];

void main() {
  runApp(const MaterialApp(
    home: MyApp(),
  ));
}

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

  @override
  State<MyApp> createState() => MyAppState();
}

class MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          floatingActionButton: FloatingActionButton(
              child: Icon(Icons.add),
              onPressed: () {
                showDialog(
                    context: context,
                    builder: (context) {
                      return Dialog1(refresh: () {
                    setState(() {});
                  });
                    });
              }),
          appBar: AppBar(
            title: Text('List of Items'),
            backgroundColor: Colors.lightBlue,
          ),
          body: ListView.builder(
              itemCount: customersList.length,
              itemBuilder: (element, index) {
                return InkWell(
                  child: Card(
                    child: customersList[index],
                  ),
                  onLongPress: () {
                    customersList.removeAt(index);
                    setState(() {});
                  },
                  
                );
              })),
    );
     }
     }

这将导致您的子对话框在其父对话框的上下文中调用设置状态