Flutter Build Tiles onTap显示错误“undefined name 'context'”

Question

我正在尝试建立多级列表视图，当我们点击子项时，它应该将参数传递给其他名为QuizOptionsDialog的页面。

1)我可以使用print ( root.name )打印root.name；使用onTap

2)但是当我们尝试使用下面的代码导航时，它显示了未定义的名称'context‘

Code page 1/2 enter code hereCode page 2/2 enter code hereError的完整代码和错误

import 'package:flutter/material.dart';
import 'package:iti/quiz/ui/widgets/quiz_options.dart';

class ExpansionTileDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('List of Question Papers'),
        ),
        body: ListView.builder(
          itemCount: data.length,
          itemBuilder: (BuildContext context, int index) => CategoryItem(
            data[index],
          ),
        ),
      ),
    );
  }
}

// Welcome to another flutter tutorial
// In this video we will see how to create a multi-level Expansion List
// First Let's create a class for each row in the Expansion List

class Category {
  final String id;
  final String name;
  final List<Category>
  children; // Since this is an expansion list ...children can be another list of entries
  Category(this.id, this.name, [this.children = const <Category>[]]);
}

// This is the entire multi-level list displayed by this app
final List<Category> data = <Category>[
  Category(
    '1',
    'Main Category',
    <Category>[
      Category(
        '1.1',
        'Sub Category',
        <Category>[
          Category('1.1.1', 'Sub-Sub Category', <Category>[
            Category('1.1.1.1', 'Sub-Sub-Sub Category',),
            Category('1.1.1.2', 'Sub-Sub-Sub Category',),
          ]),
          Category('1.1.2','Sub-Sub Category',
              <Category>[
                Category('1.1.2.1', 'Sub-Sub-Sub Category',),
                Category('1.1.2.2', 'Sub-Sub-Sub Category',),
              ]
          ),
          Category('1.1.3', 'Sub-Sub Category',
              <Category>[
                Category('1.1.3.1', 'Sub-Sub-Sub Category',),
                Category('1.1.3.2', 'Sub-Sub-Sub Category',),
              ]
          ),
        ],
      ),
    ],
  ),
];

// Create the Widget for the row
class CategoryItem extends StatelessWidget {
  const CategoryItem(this.category);
  final Category category;

  // This function recursively creates the multi-level list rows.
  Widget _buildTiles(Category root) {
    if (root.children.isEmpty) {
      return ListTile(
        title: Text(root.name),
             onTap: () {
          print(root.name);
          Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) => QuizOptionsDialog(category: category,),
            ),
          );
        },
      );

    }
    return ExpansionTile(
      key: PageStorageKey<Category>(root),
      title: Text(root.name),
      children: root.children.map<Widget>(_buildTiles).toList(),
    );
  }

  @override
  Widget build(BuildContext context) {
    return _buildTiles(category);
  }

  _categoryPressed(BuildContext context,Category category) {
    showModalBottomSheet(
      context: context,
      builder: (sheetContext) => BottomSheet(
        builder: (_) => QuizOptionsDialog(category: category,),
        onClosing: (){},

      ),

    );

  }
}

Answer 1

将您的CategoryItem类更改为也接受构造函数中的BuildContext context变量，并将其分配给BuildContext变量，就像您对category所做的那样，然后在创建新的CategoryItem时从主小部件传入该上下文。这将为您提供访问上下文的权限，并允许您进行导航。

为此，请执行以下操作：

将上下文存储在CategoryItem类中，以便每个实例都可以访问它。

class CategoryItem extends StatelessWidget {
  const CategoryItem(this.category, this.context);
  final Category category;
  final BuildContext context;

更新ListView.builder()以适当地实例化更新后的CategoryItem类并传递上下文。

body: ListView.builder(
  itemCount: data.length,
  itemBuilder: (BuildContext context, int index) => CategoryItem(
    data[index], context
  ),
),

现在，您应该可以在需要的位置访问页面的BuildContext。