Flutter 未找到 Material 个小部件

Question

我想在 flutter 中使用 mutation graphql。但是我有这个按摩，我无法加载我的代码。

这是我的代码：

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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final HttpLink httpLink = HttpLink(
      'https://test.podkadeh.ir/graphql/',
    );
    final ValueNotifier<GraphQLClient> client= ValueNotifier<GraphQLClient>(
        GraphQLClient(
          link: httpLink,
          cache: GraphQLCache(),
        )
    );
    return GraphQLProvider(
      child:   HomePage(),
      client: client,
    );
  }
}

class HomePage extends StatelessWidget {
  TextEditingController nameController = TextEditingController();
  TextEditingController emailController = TextEditingController();
  TextEditingController passwordController = TextEditingController();

  String createUser = '''
      mutation createUser{
        createUser(userInput: {Email: "$String", Password: "$String"}){
          Name,
          Email
        }
      }
''';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SingleChildScrollView(

          child: Column(
            children: [
              Mutation(
                options: MutationOptions(
                  document: gql(createUser),

                ),

                builder:(
                    RunMutation insert,
                    QueryResult? result,
                    ){
                  return
                    Column(
                      children: [
                        TextField(
                          decoration:  InputDecoration(hintText: "Name"),
                          controller: nameController,
                        ),
                        TextField(
                          decoration:  InputDecoration(hintText: "Email"),
                          controller: emailController,

                        ),
                        TextField(
                          decoration:  InputDecoration(hintText: "Password"),
                          controller: passwordController,

                        ),
                        RaisedButton(
                            child: Text("Submit"),
                            onPressed:(){
                              insert(<String, dynamic>{
                                "Email": emailController.text,
                                "Name" : nameController.text,
                                // "Password" : passwordController.text,
                              });
                            }),
                        Text("Result : \n ${result!.data?.toString()}",),
                      ],
                    );

                },

              ),
            ],
          ),

      ),
    );
  }
}

这是我遇到的错误：

`未找到 Material 小部件。

TextField 小部件需要一个 Material 小部件祖先。在 material 设计中，大多数小部件在概念上都“打印”在 material 的 sheet 上。在 Flutter 的 material 库中，material 由 Material 小部件表示。例如，它是呈现墨水飞溅的 Material 小部件。因此，许多 material 库小部件要求它们上方的树中有一个 Material 小部件。

要引入 Material 小部件，您可以直接包含一个小部件，也可以使用本身包含 Material 的小部件，例如卡片、对话框、抽屉或脚手架。

找不到 Material 祖先的特定小部件是：TextField 控制器：TextEditingController#c0f68(TextEditingValue(text: ┤├, selection: TextSelection(baseOffset: -1, extentOffset: -1, affinity: TextAffinity.downstream, isDirectional: false), composing: TextRange(start: -1, end ：-1）））装饰：InputDecoration（提示文本：“名称”）肮脏的依赖项：[UnmanagedRestorationScope, MediaQuery] 状态：_TextFieldState#49d5d 这个小部件的祖先是：：柱子方向：垂直 mainAxisAlignment：开始 crossAxisAlignment：中心渲染对象：RenderFlex#ce4db 需要布局需要绘画 : StreamBuilder<查询结果?> 状态：_StreamBuilderBaseState>#26355 ：突变依赖项：[_InheritedGraphQLProvider] 状态：MutationState#0e229 ：柱子方向：垂直 mainAxisAlignment：开始 crossAxisAlignment：中心 renderObject: RenderFlex#1a73f NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE : 单子滚动视图依赖项：[PrimaryScrollController] : Material应用程序状态：_MaterialAppState#7f306 ：主页 : _InheritedGraphQLProvider : GraphQL提供者状态：_GraphQLProviderState#bab20 : 我的应用程序 ... 导致错误的相关小部件是： TextField TextField:file:///G:/%D8%B3%D9%88%D8%B1%D8%B3%20%D9%87%D8%A7%DB%8C%20%D9%81% D9%84%D8%A7%D8%AA%D8%B1/mutation_gql/lib/main.dart:62:25`

谁能帮帮我？

Answer 1

您应该使用 Scaffold 或 Material :

 @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: SingleChildScrollView(
      
            child: Column(
              children: [
                Mutation(
                  options: MutationOptions(
                    document: gql(createUser),
      
                  ),
      
                  builder:(
                      RunMutation insert,
                      QueryResult? result,
                      ){
                    return
                      Column(
                        children: [
                          TextField(
                            decoration:  InputDecoration(hintText: "Name"),
                            controller: nameController,
                          ),
                          TextField(
                            decoration:  InputDecoration(hintText: "Email"),
                            controller: emailController,
      
                          ),
                          TextField(
                            decoration:  InputDecoration(hintText: "Password"),
                            controller: passwordController,
      
                          ),
                          RaisedButton(
                              child: Text("Submit"),
                              onPressed:(){
                                insert(<String, dynamic>{
                                  "Email": emailController.text,
                                  "Name" : nameController.text,
                                  // "Password" : passwordController.text,
                                });
                              }),
                          Text("Result : \n ${result!.data?.toString()}",),
                        ],
                      );
      
                  },
      
                ),
              ],
            ),
      
        ),
      ),
    );
  }
}

Flutter 未找到 Material 个小部件

Flutter No Material widget found

widget

dart

graphql

flutter

graphql-mutation