flutter 获取错误“无法将参数类型”JsObject“分配给参数类型”BuildContext“”

7cjasjjr  于 2023-01-14  发布在  Flutter
关注(0)|答案(2)|浏览(208)

我试着修复它,但它对我不起作用。我想我错过了一些东西,它在旧版本的Flutter中起作用,但在最近的版本中不起作用。
我正在尝试在图像上设置(onTap)功能以转到下一个小部件屏幕。
下面是我的代码:

import 'dart:js';
    
    import 'package:flutter/material.dart';
    import 'package:zar/screen/category.dart';
    
    class TopCard extends StatefulWidget {
      const TopCard({Key? key}) : super(key: key);
    
      @override
      State<TopCard> createState() => _TopCardState();
    }
    
    // TOP CARD CLASS STARTS HERE
    class CardItem {
      final String urlImage;
      final String title;
      final String subTitle;
    
      const CardItem({
        required this.urlImage,
        required this.title,
        required this.subTitle,
      });
    }
    
    // TOP CARD WIDGETS STARTS HERE
    Widget topCard({
      required CardItem item,
    }) =>
        Container(
          width: 150,
          child: Column(
            children: [
              Expanded(
                child: AspectRatio(
                  aspectRatio: 2 / 2,
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(10),
                    child: Material(
                      child: Ink.image(
                        image: NetworkImage(item.urlImage),
                        child: InkWell(
                          onTap: () => Navigator.push(
                            context,
                            MaterialPageRoute(
                              builder: (context) => Categories(
                                item: item,
                              ),
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
              const SizedBox(height: 4),
              Text(
                item.title,
                style: const TextStyle(
                    color: Color(0xff5e35b1),
                    fontSize: 20,
                    fontWeight: FontWeight.bold),
              ),
              Text(
                item.subTitle,
                style: const TextStyle(
                  color: Colors.redAccent,
                ),
              ),
            ],
          ),
        );
    
    class _TopCardState extends State<TopCard> {
    // TOP CARD LIST VIEW STARTS HERE
      List<CardItem> items = const [
        CardItem(
          urlImage:
              'https://img.freepik.com/free-vector/pizza-melted-cartoon-illustration-flat-cartoon-style_138676-2876.jpg?size=338&ext=jpg',
          title: 'PIZZA',
          subTitle: '\$20',
        ),
        CardItem(
          urlImage:
              'https://img.freepik.com/free-vector/triangle-sandwich-cartoon-icon-illustration_368721-11.jpg?size=338&ext=jpg',
          title: 'SANDWICH',
          subTitle: '\$7.99',
        ),
        CardItem(
          urlImage:
              'https://thumbs.dreamstime.com/b/french-fries-icon-flat-vector-related-icon-long-shadow-web-mobile-applications-can-be-used-as-logo-pictogram-icon-90676285.jpg',
          title: 'FRIES',
          subTitle: '\$2.99',
        ),
        CardItem(
          urlImage:
              'https://i.pinimg.com/originals/42/de/53/42de53a97cac79ddcaee570c436a10e6.jpg',
          title: 'BURGER',
          subTitle: '\$5.99',
        ),
      ];
      @override
      Widget build(BuildContext context) {
        return Container(
          margin: const EdgeInsets.only(top: 20),
          height: 150,
          child: ListView.separated(
            scrollDirection: Axis.horizontal,
            itemCount: 4,
            separatorBuilder: (constext, _) => const SizedBox(width: 16),
            itemBuilder: (context, index) => topCard(
              item: items[index],
            ),
          ),
        );
      }
    }

但在(上下文)中出现错误

child: InkWell(
     onTap: () => Navigator.push(
     context,
      MaterialPageRoute(
       builder: (context) => Categories(
        item: item,
        ),
       ),
      ),
     ),
0x6upsns

0x6upsns1#

你的助手方法需要context

child: InkWell(
     onTap: () => Navigator.push(
     context, // HERE You need context
      MaterialPageRoute(
       builder: (context) => Categories(
        item: item,
        ),
       ),
      ),
     ),

因此将其添加为参数
//顶卡小工具从此处开始

Widget topCard({
      required CardItem item,
      required BuildContext context
    }) => ...

并除去了

import 'dart:js'; // it gives you another context that you don't need 'JsObject'

另一个解决方案是在状态类中移动topCard帮助器方法,这样就不必将context作为参数传递。

lvjbypge

lvjbypge2#

我得到了同样的错误。Flutter自动导入dart.js库,这是给错误。去文件的顶部,并删除此行:

import 'dart:js';

相关问题