Flutter读取本地JSON文件报错，请求排查问题原因及解决办法

我来帮你排查下这个读取本地JSON的问题，看下来主要有几个核心问题需要修正，一个个来梳理：

1. 未处理FutureBuilder的快照状态 #

你现在直接在builder里用snapshot.data，但FutureBuilder有几个关键状态：加载中（waiting）、加载成功（hasData）、加载失败（hasError）。如果数据还没加载完成，snapshot.data就是null，这时候调用mydata["name"]自然会抛出NoSuchMethodError——因为你在null对象上调用了[]方法。

2. 错误解析ByteData为字符串 #

DefaultAssetBundle.of(context).load()返回的是ByteData类型，直接调用toString()不会得到JSON的文本内容，反而会生成类似TypedDataView(cid: 146)的字符串，这就导致了FormatException，因为json.decode根本认不出这个格式。

3. 别忘了在pubspec.yaml中声明assets #

如果没在pubspec里配置assets路径，Flutter根本找不到你的file.json文件，这也是常见的隐形问题。

修正后的完整代码 #

import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/material.dart';

main() => runApp(const HomePage());

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: FutureBuilder<ByteData>(
          future: DefaultAssetBundle.of(context).load("assets/file.json"),
          builder: (context, snapshot) {
            // 处理加载中状态
            if (snapshot.connectionState == ConnectionState.waiting) {
              return const Center(child: CircularProgressIndicator());
            }
            // 处理加载错误状态
            if (snapshot.hasError) {
              return Center(child: Text('加载出错: ${snapshot.error}'));
            }
            // 加载成功，解析数据
            if (snapshot.hasData) {
              // 将ByteData转为UTF8字符串
              final jsonString = utf8.decode(snapshot.data!.buffer.asUint8List());
              final mydata = json.decode(jsonString);
              return Center(child: Text(mydata["name"]));
            }
            // 兜底返回
            return const Center(child: Text('无数据'));
          },
        ),
      ),
    );
  }
}

配置pubspec.yaml #

确保你的pubspec.yaml里添加了assets声明（注意缩进要和flutter对齐）：

flutter:
  uses-material-design: true
  assets:
    - assets/file.json

后续调用WordPress REST API的小提示 #

等你切换到调用WordPress API时，逻辑是类似的：用Future发起网络请求，然后在FutureBuilder里严格处理各个状态（加载中、成功、失败），解析响应的时候记得先检查响应状态码，再把响应体转为字符串后解码JSON。

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