繁体   English   中英

如何使用 flutter 中的小部件列出 map

[英]How to map list with widgets in flutter

我想要一个普通的问题类型的东西。 一旦第一个问题得到回答,它应该 go 到下一个问题。 但是当我使用.map() 时,出现了一个错误,因为'类型'Null' 不是类型转换中'List' 类型的子类型'。 The.map() 和传播运算符在以前版本的 flutter 中用于 function 但现在它们不是。有人可以为此提供解决方案吗?

这是以下代码-main.dart


class MyAppState extends State<MyApp> {
  int qindex = 0;

  void answeQues() {
    setState(() {
      qindex = qindex + 1;
    });

    print(qindex);
  }

  @override
  Widget build(BuildContext context) {
    var questions = [
      {
        'questionText': 'what\'s your favourite color?',
        'answers': ['R', 'G', 'B', 'Y']
      },
      {
        'questionText': 'what\'s your favourite animal?',
        ' answers': ['Rabbit', 'Giraffe', 'Bear', 'Yax']
      },
      {
        'questionText': 'what\'s your favourite sport?',
        'answers': ['Rugby', 'Cricket', 'Basketball', 'Football']
      },
    ];

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('My first App'),
        ),
        body: Column(
          children: [
            Questions(
              questions[qindex]['questionText'].toString(),
            ),
            ...(questions[qindex]['answers'] as List<String>).map((answer) {
              return Answers(answeQues, answer);
            }).toList()

            // questions[qindex]['answers'].entries.map((answer) {
            //   return Answers(answeQues, answer);
            // }).toList()
          ],
        ),
      ),
    );
  }
}

这是我的答案。dart 文件

import 'package:flutter/material.dart';

class Answers extends StatelessWidget {
  final Function selectHandler;
  final String answerText;

  Answers(this.selectHandler, this.answerText);
  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      padding: EdgeInsets.all(10),
      child: RaisedButton(
        color: Colors.blue,
        child: Text(answerText),
        onPressed: () {
          selectHandler();
        },
      ),
    );
  }
}

错误:-

“Null”类型不是类型转换中“List”类型的子类型。

对于第二个问题,键名( ' answers' )的开头有空格,这会导致问题:

var questions = [
  ...
  {
    'questionText': 'what\'s your favourite animal?',
    ' answers': ['Rabbit', 'Giraffe', 'Bear', 'Yax']
  },
  ...
];

.map() 和spread 操作符没有什么问题,它们仍然在Flutter 中使用。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM