如何在Flutter中使用自定义小部件

Question

我是Flutter的新手，我正在遵循Flutter的官方教程来学习Flutter的基础知识。

所以，我想创建一个名为“ CustomCard”的可重用组件，我这样做是：

class CustomCard extends StatelessWidget {
CustomCard({@required this.index, @required this.onPress});

   final index;
   final Function onPress;

   @override
   Widget build(BuildContext context) {
      return Card(
          child: Column(
              children: <Widget>[
                  Text('Card $index'),
                  FlatButton(
                      child: const Text('Press'),
                      onPressed: this.onPress,
                  )
             ],
          ),
      );
   }
}

现在，要在MyApp中使用它，我这样做：

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
    // This widget is the root of your application.
    @override
    Widget build(BuildContext context) {
        return MaterialApp(
            title: 'Welcome to flutter',
                home: Scaffold(
                    appBar: AppBar(
                        title: Text('hello'),
                    ),
                body: Center(
                    child: Text('centre'),
                    CustonCard(
                        index:'card1',
                        onPress: print(' this is $index')
                    ),
                ),
            ),
        );
       }
      }

现在我的IDE表示：

未为类“ MyApp”定义方法“ CustonCard”。

如何解决这个问题？

Answer 1

嘿，请检查您的班级名称，它定义为CustomCard，但您正在使用它进行访问

**CustonCard**(
              index:'card1',
              onPress: print(' this is $index')
                    ),

并且还要检查导入的CustomCard