从Flutter选项卡页面中的一个statefulWidget调用方法

dgsult0t  于 2023-01-09  发布在  Flutter
关注(0)|答案(1)|浏览(156)

我有两个小部件-一个是带有标签和按钮的主页面,第二个是带有一些文本字段的页面。我想在单击按钮后清除所有文本字段。我尝试使用GlobalKey<_Page1> _key = GlobalKey<_Page1>();_key.currentState!.CleanAll();,但收到错误-未处理的异常:对空值使用了空检查运算符
你对怎么做还有别的想法吗?

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

  @override
  _MyTabsState createState() => _MyTabsState();
}

class _MyTabsState extends State<MyTabs> {

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        DefaultTabController(
          length: 1, // length of tabs
          initialIndex: 0,
          child: Column(
            children: <Widget>[
              const TabBar(
                labelColor: Colors.green,
                unselectedLabelColor: Colors.blueGrey,
                tabs: [
                  Tab(text: 'Page 1'),
                ],
              ),
              SizedBox(
                height: 200,
                child: TabBarView(
                    children: <Widget>[
                      Page1(),
                    ]
                ),
              ),
            ],
          ),),

        ElevatedButton(
            onPressed: () {
              // <- clean all TextField in Page1
            },
            child: Text('Clean')
        ),
      ],
    );
  }
}

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

  @override
  _Page1State createState() => _Page1State();
}

class _Page1State extends State<Page1> {

  TextEditingController text1 = TextEditingController();
  TextEditingController text2 = TextEditingController();

  void CleanAll() {
    text1.clear();
    text2.clear();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
      TextField(
        controller: text1,
      ),
        TextField(
          controller: text2,
        ),
      ],
    );
  }
}
6yt4nkrj

6yt4nkrj1#

您可以使用ValueNotifier来侦听Page1。然后我们将覆盖Page1上的initState并清除控件。

class _MyTabsState extends State<MyTabs> {
  final ValueNotifier<bool> clearNotifier = ValueNotifier(false);

将其传递给Page1

Page1(
  clearCallback: clearNotifier,
),

通知监听器我们只是在切换值。bool值不重要,我们只需要更新它。

onPressed: () {
  clearNotifier.value = !clearNotifier.value;
},

和第1页

class Page1 extends StatefulWidget {
  final ValueNotifier clearCallback;
  const Page1({Key? key, required this.clearCallback}) : super(key: key);

  @override
  _Page1State createState() => _Page1State();
}

class _Page1State extends State<Page1> {
  @override
  void initState() {
    super.initState();
    widget.clearCallback.addListener(() {
      CleanAll();
    });
  }

测试片段

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

  @override
  _MyTabsState createState() => _MyTabsState();
}

class _MyTabsState extends State<MyTabs> {
  final ValueNotifier<bool> clearNotifier = ValueNotifier(false);
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        DefaultTabController(
          length: 1, // length of tabs
          initialIndex: 0,
          child: Column(
            children: <Widget>[
              const TabBar(
                labelColor: Colors.green,
                unselectedLabelColor: Colors.blueGrey,
                tabs: [
                  Tab(text: 'Page 1'),
                ],
              ),
              SizedBox(
                height: 200,
                child: TabBarView(children: <Widget>[
                  Page1(
                    clearCallback: clearNotifier,
                  ),
                ]),
              ),
            ],
          ),
        ),
        ElevatedButton(
            onPressed: () {
              clearNotifier.value = !clearNotifier.value;
            },
            child: Text('Clean')),
      ],
    );
  }
}

class Page1 extends StatefulWidget {
  final ValueNotifier clearCallback;
  const Page1({Key? key, required this.clearCallback}) : super(key: key);

  @override
  _Page1State createState() => _Page1State();
}

class _Page1State extends State<Page1> {
  @override
  void initState() {
    super.initState();
    widget.clearCallback.addListener(() {
      CleanAll();
    });
  }

  TextEditingController text1 = TextEditingController();
  TextEditingController text2 = TextEditingController();

  void CleanAll() {
    text1.clear();
    text2.clear();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        TextField(
          controller: text1,
        ),
        TextField(
          controller: text2,
        ),
      ],
    );
  }
}

相关问题