Flutter加载JSON数据时ParentDataWidget误用及资源加载错误如何解决？

1. ParentDataWidget使用不当报错原因 #

ParentDataWidget 类的组件（常见的有Expanded、Flexible、Positioned）必须放在特定父容器内使用，触发该报错的常见原因如下：

• Positioned 组件仅能在 Stack 组件内使用，放在 Column、Row、Container 等非Stack容器中会报错
• Expanded、Flexible 仅能在 Flex 类容器（Column、Row、Flex）中使用，若外层嵌套了Padding、Container等非Flex容器会触发报错
• 多个ParentDataWidget嵌套使用（如Expanded内部再套Expanded）也会触发该报错
  你当前贴出的代码中Expanded放在Column内的用法是正确的，可检查页面其他部分或相关页面是否存在上述错误写法。

2. 现有数据加载结构评估与搜索功能适配性 #

现有结构问题 #

你当前的实现逻辑存在明显错误，无法正常渲染数据：

• 你的JSON单条结构是包含VERB、MEANING、EXAMPLE三个字段的对象，正常JSON文件应该是对象数组格式（外层包[]，多个条目用逗号分隔），你当前代码中直接将data["VERB"]（字符串类型）赋值给数组类型的_items，后续调用_items.length、_items[index]["VERB"]都会直接抛出类型错误。
• 拆分三个独立数组存储同一条目的三个字段逻辑不合理，后续索引匹配容易出现错位问题。

优化建议 #

建议先定义数据模型统一存储单条数据：

class WordItem {
  final String verb;
  final String meaning;
  final String example;
  WordItem({required this.verb, required this.meaning, required this.example});
}

修改数据解析逻辑：

List<WordItem> _allItems = []; // 全量数据源，用于搜索
List<WordItem> _displayItems = []; // 过滤后显示的数据源

Future<void> readJson() async {
  final String response = await rootBundle.loadString('assets/files/myfiles.json');
  final List<dynamic> data = json.decode(response);
  setState(() {
    _allItems = data.map((item) => WordItem(
      verb: item["VERB"],
      meaning: item["MEANING"],
      example: item["EXAMPLE"]
    )).toList();
    _displayItems = List.from(_allItems); // 初始化显示全量数据
  });
}

搜索功能适配 #

优化后实现搜索非常简单，只需要给搜索栏加输入回调，根据关键词过滤_allItems更新_displayItems再刷新页面即可，完全可以正常运行。之前FutureBuilder实现失败大概率是因为数据解析逻辑错误导致的，修正后可以正常使用FutureBuilder实现页面初始化时自动加载数据。

3. 资源加载404报错解决 #

报错提示加载路径是assets/assets/files/myfiles.json，说明路径拼接时多了一层assets，问题出在pubspec.yaml的资源配置：

• 检查你的pubspec.yaml中flutter下的assets配置，应该多写了一层assets，正确配置如下：

flutter:
  # 注意缩进，assets要在flutter下缩进2个空格
  assets:
    - assets/files/

• 配置后执行flutter pub get重新加载资源即可，你代码中rootBundle.loadString的路径写法是正确的，不需要修改。
  另外注意你的JSON文件格式，单条对象末尾不要加多余的逗号，如果是多条数据要放在数组[]内，条目之间用逗号分隔。

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