flutter - 如何删除小部件以响应用户输入？

Question

我有一个芯片。用户删除后如何让芯片消失？我完全不理解 Flutter Docs 中的代码。
我什么都试过了。

Chip(
 deleteIcon:  Icon(Icons.close, size: 15,),
 label: Text('Delete me!'),
 deleteButtonTooltipMessage: 'erase',
 onDeleted: () {setState(() {print("I want to erase this chip, and     eat chips");}); },
)

文档建议可以删除该芯片(Chip)。但他们并没有给出太多的例子。

Answer 1

我假设你有这个 Chip在某种 StatefulWidget .

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

  @override
  State createState() => _DisappearingChipState();
}

class _DisappearingChipState extends State<DisappearingChip> {
  bool erased;

  @override
  void initState() {
    erased = false;
    super.initState();
  }

  @override
  Widget build(BuildContext context) => erased
      ? Container()
      : Chip(
          deleteIcon: Icon(
            Icons.close,
            size: 15,
          ),
          label: const Text('Delete me!'),
          deleteButtonTooltipMessage: 'erase',
          onDeleted: () {
            setState(() {
              erased = true;
            });
          },
        );
}

响应状态的变量

如您所见， State object持有 bool调用 erased已分配 false当状态初始化时。
当 Chip意味着现在要被删除，这个变量被更新并且小部件重建。因为它响应 erased 的值, 一个空的 Container一次返回 Chip被删除。

我推荐这个 resource to learn more .