flutter - 为什么我从这个回调中得到一个空值？

Question

我试图将 newTaskText 的值从第二个类移动到第一个类，我有一个回调，它是第二个类中的 addTaskCallback，当我按下平面按钮将值移动到第一个类时，我使用它TasksScreen 但是当我尝试打印它的值为 null 时，知道为什么吗？

   import 'package:flutter/cupertino.dart';
    import 'package:flutter/material.dart';
    import 'package:todoey/widgets/tasks_list.dart';
    import 'add_task_screen.dart';
    import 'package:todoey/models/task.dart';
    
    class TasksScreen extends StatefulWidget {
      @override
      _TasksScreenState createState() => _TasksScreenState();
    }
    
    class _TasksScreenState extends State<TasksScreen> {
      List<Task> tasks = [
        Task(name: 'Buy Milk'),
        Task(name: 'Buy eggs'),
        Task(name: 'Buy bread'),
      ];
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          backgroundColor: Colors.lightBlueAccent,
          //backgroundColor: Colors.lightBlueAccent,
          floatingActionButton: FloatingActionButton(
            backgroundColor: Colors.lightBlueAccent,
            //backgroundColor: Colors.lightBlueAccent,
            onPressed: () {
              showModalBottomSheet(
                context: context,
                builder: (context) => AddTaskScreen(
                  (newTaskText) {
                    print(newTaskText);
                  },
                ),
              );
            },
            child: Icon(Icons.add),
          ),
          body: SafeArea(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Container(
                  padding: EdgeInsets.only(
                      top: 60.0, bottom: 30.0, right: 30.0, left: 30.0),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      CircleAvatar(
                        backgroundColor: Colors.white,
                        radius: 30.0,
                        child: Icon(
                          Icons.list,
                          color: Colors.lightBlueAccent,
                          size: 30.0,
                        ),
                      ),
                      SizedBox(height: 10.0),
                      Text(
                        'Todoey',
                        style: TextStyle(
                          color: Colors.white,
                          fontWeight: FontWeight.w700,
                          fontSize: 50.0,
                        ),
                      ),
                      Text(
                        '12 tasks',
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 18.0,
                        ),
                      ),
                    ],
                  ),
                ),
                Expanded(
                  child: Container(
                    padding: EdgeInsets.symmetric(horizontal: 20),
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(30),
                        topRight: Radius.circular(30),
                      ),
                    ),
                    child: TasksList(tasks),
                  ),
                ),
              ],
            ),
          ),
        );
      }
    }

---

import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
import 'package:todoey/models/task.dart';

class AddTaskScreen extends StatelessWidget {
  final Function addTaskCallback;

  AddTaskScreen(this.addTaskCallback);

  @override
  Widget build(BuildContext context) {
    String newTaskTitle;

    return Container(
      color: Color(0xff757575),
      child: Container(
        padding: EdgeInsets.all(20.0),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(30.0),
            topRight: Radius.circular(30.0),
          ),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Text(
              'Add Task',
              textAlign: TextAlign.center,
              style: TextStyle(
                color: Colors.lightBlueAccent,
                fontSize: 30.0,
              ),
            ),
            TextField(
              autofocus: true,
              textAlign: TextAlign.center,
              onChanged: (newText) {
                newTaskTitle = newText;
              },
            ),
            SizedBox(
              height: 10.0,
            ),
            FlatButton(
              color: Colors.lightBlueAccent,
              onPressed: () {
                addTaskCallback(newTaskTitle);
                print(newTaskTitle);
              },
              child: Text(
                'Add',
                style: TextStyle(
                  color: Colors.white,
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}

标签： flutterflutter-layout

Answer 1

您的问题是您newTaskTitle在 build 方法中定义了 var 。将其从构建方法中移出应该可以解决您的问题！

您的回调实现没有问题。唯一可以改进的是定义回调函数中发送的变量的类型

final Function(String) addTaskCallback;

您还可以使用 TextController 而不是在 onChanged 方法中更新的 var。

import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';

class AddTaskScreen extends StatefulWidget {
  final Function(String) addTaskCallback;

  AddTaskScreen(this.addTaskCallback);

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

class _AddTaskScreenState extends State<AddTaskScreen> {
  TextEditingController textController = new TextEditingController();

  @override
  Widget build(BuildContext context) {

    return Container(
      color: Color(0xff757575),
      child: Container(
        padding: EdgeInsets.all(20.0),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(30.0),
            topRight: Radius.circular(30.0),
          ),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Text(
              'Add Task',
              textAlign: TextAlign.center,
              style: TextStyle(
                color: Colors.lightBlueAccent,
                fontSize: 30.0,
              ),
            ),
            TextField(
              autofocus: true,
              controller: textController,
              textAlign: TextAlign.center,
            ),
            SizedBox(
              height: 10.0,
            ),
            FlatButton(
              color: Colors.lightBlueAccent,
              onPressed: () {
                widget.addTaskCallback(textController.text);
                print(textController.text);
              },
              child: Text(
                'Add',
                style: TextStyle(
                  color: Colors.white,
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}

玩得开心！