Flutter开发报错：Expected to find ']'，传递IconButton时遇问题

错误原因分析 #

你的代码存在两个关键问题：

• 列表元素写法错误：Column的children是Widget数组，要求直接传入Widget实例，错误地使用了widget:这种命名参数格式导致语法报错。
• 拼写错误：Icon(icons.calendar_today_outlined)中的icons应为大写的Icons，这是Flutter内置的图标类。

修正后的代码 #

import 'package:app15/ui/theme.dart';
import 'package:app15/widgets/input_field.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:intl/intl.dart';

class AddTaskPage extends StatefulWidget {
  const AddTaskPage({Key? key}) : super(key: key);

  @override
  State<AddTaskPage> createState() => _AddTaskPageState();
}

class _AddTaskPageState extends State<AddTaskPage> {
  DateTime _selectedDate = DateTime.now();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: _appBar(context),
      body: Container(
        padding: const EdgeInsets.only(left: 20, right: 20),
        child: SingleChildScrollView(
          child: Column(
            children: [
              Text(
                "Add Task",
                style: headingStyle,
              ),
              MyInputField(title: "Title", hint: "Enter your title"),
              MyInputField(title: "Note", hint: "Enter your note"),
              MyInputField(title: "Date", hint: DateFormat.yMd().format(_selectedDate)),
              // 移除多余的widget:，直接传入IconButton实例
              IconButton(
                icon: Icon(Icons.calendar_today_outlined), // 修正icons为Icons
                onPressed: () {
                  // 可在此添加日期选择逻辑
                },
              )
            ],
          ),
        )
      ),
    );
  }

  _appBar(BuildContext context) {
    return AppBar(
      elevation: 0,
      leading: GestureDetector(
        onTap: (){
          Get.back();
        },
        child: Icon(
          Icons.arrow_back_ios,
          size: 20,
          color: Colors.black,
        ),
      ),
    );
  }
}

优化建议（可选） #

如果需要将IconButton作为日期输入项的右侧操作按钮，可以把它们组合在Row中，让布局更合理：

Row(
  children: [
    Expanded(
      child: MyInputField(title: "Date", hint: DateFormat.yMd().format(_selectedDate)),
    ),
    IconButton(
      icon: Icon(Icons.calendar_today_outlined),
      onPressed: () {
        // 打开日期选择器逻辑
      },
    )
  ],
)

内容的提问来源于stack exchange，提问作者Jay Khatri