输入时删除Flutter Draggable TextFormField。

Question

你好，我是flutter的新手，正在做一个项目，并在flutter中创建一个表单构建器。 要做到这一点，我们正在使用可拖动的项目，如文本输入字段。可拖动项目被放置在拖动目标中，并被接受。然而，问题是当我们去点击项目以输入文本时，项目立即被删除。在下图中，蓝色是拖动目标，下面的白色是可拖动项目。如你所见，文本输入是正确添加的，只是当我尝试向字段添加输入时，该项目在我开始输入之前就被立即删除了。

我已经在VS代码调试器上完成了这一步骤，当我点击输入文本时，它在项目被删除之前将我返回到这个片段。

Container(
                      width: MediaQuery.of(context).size.width / 4,
                      child: Draggable<Widget>(
                        child: ListTile(
                          title: Text('Add Text Response'),
                          trailing: Icon(Icons.text_fields),
                        ),
                        data: new TextInputItem(),
                        feedback: Text('Text'),
                      ),

这是相关代码

class CreateProject extends StatefulWidget {
  @override
  _CreateProjectState createState() => _CreateProjectState();
}

    class _CreateProjectState extends State<CreateProject> {

      @override
      Widget build(BuildContext context) {
        List<Widget> acceptData = [];

        return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text("Create New Project"),
            ),
            body: Padding(
              padding: EdgeInsets.all(10),
              child: Container(
                child: Column(
                  children: <Widget>[
                    Expanded(
                      child: DragTarget(
                        onWillAccept: (Widget addItem) {
                          print('checking if will accept item');
                          print(addItem);
                          if (addItem == null) {
                            return false;
                          }
                          return true;
                        },
                        onAccept: (Widget addItem) {
                          print('accepting an item');
                          acceptData.add(addItem);
                          print(acceptData);
                        },
                        builder: (context, List<dynamic> candidateData,
                            List<dynamic> rejectedData) {
                          return Container(
                            height: MediaQuery.of(context).size.height,
                            color: Colors.lightBlue[50],
                            child: acceptData.isEmpty
                                ? Center(
                                    child: Text('Add Form Fields Here'),
                                  )
                                : Column(children: acceptData),
                          );
                        },
                      ),
                    ),
                    Column(
                      children: <Widget>[
                        Container(
                          width: MediaQuery.of(context).size.width / 4,
                          child: Draggable<Widget>(
                            child: ListTile(
                              title: Text('Add Text Response'),
                              trailing: Icon(Icons.text_fields),
                            ),
                            data: new TextInputItem(),
                            feedback: Text('Text'),
                          ),
                        ),
                      ],
                    ),
                    Column(
                      children: <Widget>[
                        Container(
                          width: MediaQuery.of(context).size.width / 4,
                          child: Draggable<Widget>(
                            child: ListTile(
                              title: Text('Add User Location'),
                              trailing: Icon(Icons.location_on),
                            ),
                            //child: Text('User Location'),
                            data: new UserLocation(),
                            feedback: Text('Text'),
                          ),
                        ),
                      ],
                    ),
                    Column(
                      children: <Widget>[
                        Container(
                          width: MediaQuery.of(context).size.width / 4,
                          child: Draggable<Widget>(
                            data: new MultipleChoice(),
                            feedback: Text('Mult choice'),
                            child: ListTile(
                              title: Text('Add Multiple choice'),
                              trailing: Icon(Icons.add_box),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          ),
        );
      }
    }

    class TextInputItem extends StatefulWidget {
      @override
      _TextInputItemState createState() => _TextInputItemState();
    }

    class _TextInputItemState extends State<TextInputItem> {
       final controller = new TextEditingController();
      @override
      Widget build(BuildContext context) {
        return Container(
          margin: new EdgeInsets.all(8.0),
          child: new TextField(
            controller: controller,
            decoration: new InputDecoration(
              hintText: 'Text Input Prompt',
            ),
          ),
        );
      }
    }

下面是一个图片示例。

Answer 1

因为你声明 acceptData 在 Widget build 当 Widget 改造 acceptData 成为 null 再次请从

@override
  Widget build(BuildContext context) {
    List<Widget> acceptData = [];

至

List<Widget> acceptData = [];
@override
  Widget build(BuildContext context) {