【问题标题】:how to get the id from statefull widget to stateless widget in flutter?如何在flutter中从有状态小部件获取id到无状态小部件?
【发布时间】:2021-08-27 03:27:20
【问题描述】:

我需要从 category() 类中的 quizCatId 获取 id 到 QuizTile() 有人可以告诉我如何解决这个问题...

我需要从具有 quizid 和 quizcatid 的 firestore 调用子类别数据,并且我有我的 quizdata,因此我需要将 id 都传递给 quizdata 以从 firestore 获取数据

class Category extends StatefulWidget {
  String quizCatId;
  Category(this.quizCatId);

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

class _CategoryState extends State<Category> {
  Stream quizStream;
  DatabaseService databaseService = new DatabaseService();

  Widget quizList() {
    return Container(
      child: Column(
        children: [
          StreamBuilder(
            stream: quizStream,
            builder: (context, snapshot) {
              return snapshot.data == null
                  ? Container()
                  : ListView.builder(
                      shrinkWrap: true,
                      physics: ClampingScrollPhysics(),
                      itemCount: snapshot.data.documents.length,
                      itemBuilder: (context, index) {
                        return QuizTile(
                          noOfQuestions: snapshot.data.documents.length,
                          imageUrl:
                              snapshot.data.documents[index].data['quizImgUrl'],
                          title:
                              snapshot.data.documents[index].data['quizTitle'],
                          desc: snapshot.data.documents[index].data['quizDesc'],
                          quizid: snapshot.data.documents[index].data["quizId"],
                         
                        );
                      });
            },
          ),
        ],
      ),
    );
  }

  @override
  void initState() {
    databaseService.getCatData(widget.quizCatId).then((value) {
      quizStream = value;
      setState(() {});
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        centerTitle: true,
        title: appBar(context),
        brightness: Brightness.light,
        elevation: 0.0,
        backgroundColor: Colors.transparent,
        //brightness: Brightness.li,
      ),
      body: SingleChildScrollView(child: quizList()),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: () {
          Navigator.push(context,
              MaterialPageRoute(builder: (context) => CreateCategoryQuiz()));
        },
      ),
    );
  }
}

class QuizTile extends StatelessWidget {
  final String imageUrl, title, quizid, desc, quizcatId;
  final int noOfQuestions;

  QuizTile({
    @required this.title,
    @required this.imageUrl,
    @required this.desc,
    @required this.quizid,
    @required this.noOfQuestions,
    @required this.quizcatId,
  });

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        Navigator.push(
            context,
            MaterialPageRoute(
                builder: (context) => PlayQuiz(quizid, quizcatId)));
      },
      child: Container(
        padding: EdgeInsets.symmetric(horizontal: 14),
        height: 150,
        margin: EdgeInsets.only(bottom: 8),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(8),
          child: Stack(
            children: [
              Image.network(
                imageUrl,
                fit: BoxFit.cover,
                width: MediaQuery.of(context).size.width,
              ),
              Container(
                color: Colors.black26,
                child: Center(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        title,
                        style: TextStyle(
                            fontSize: 18,
                            color: Colors.white,
                            fontWeight: FontWeight.w500),
                      ),
                      SizedBox(
                        height: 4,
                      ),
                      Text(
                        desc,
                        style: TextStyle(
                            fontSize: 13,
                            color: Colors.white,
                            fontWeight: FontWeight.w500),
                      )
                    ],
                  ),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}

【问题讨论】:

    标签: flutter dart flutter-layout flutter-dependencies flutter-test


    【解决方案1】:

    嘿,你可以通过 windget 属性访问 statefulWidget 属性。

    您所要做的就是在 QuizTile 构造函数中添加新参数并调用它们

    QuizTile(
                              noOfQuestions: snapshot.data.documents.length,
                              imageUrl:
                                  snapshot.data.documents[index].data['quizImgUrl'],
                              title:
                                  snapshot.data.documents[index].data['quizTitle'],
                              desc: snapshot.data.documents[index].data['quizDesc'],
                              quizid: snapshot.data.documents[index].data["quizId"],
                             quizCatId: widget.quizCatId
                            );  
    

    【讨论】:

    • @SubinSunil 如果可行,我建议将此答案标记为正确(打勾按钮),以便帮助遇到相同问题的其他人
    • 哦是的对不起我忘了
    猜你喜欢
    • 2018-09-01
    • 1970-01-01
    • 2021-05-19
    • 2021-06-11
    • 2021-02-16
    • 2019-10-06
    • 2019-09-23
    • 2019-12-20
    • 2021-09-21
    相关资源
    最近更新 更多