美文网首页fullter
Flutter 中获取本地 json 并解码 (附官方示例代码)

Flutter 中获取本地 json 并解码 (附官方示例代码)

作者: 望穿秋水小作坊 | 来源:发表于2020-07-01 16:52 被阅读0次
    // pubspec.yaml  文件配置
      assets:
        - asserts/name_data.json
    
    方法一:使用 rootBundle 获取本地 json 文件。
    // main.dart 中调用
    import 'dart:convert';
    import 'package:flutter/services.dart';
    
    var _dataList;
        rootBundle.loadString('asserts/name_data.json').then((value) {
          _dataList = json.decode(value);
          print(_dataList);
        });
    
    
    方法二:使用 DefaultAssetBundle 获取本地 json 文件。
    // 官方示例代码
    class MyAppState extends State<MyApp> {
      List data;
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
              title: Text("Load local JSON file"),
            ),
            body: Container(
              child: Center(
                // Use future builder and DefaultAssetBundle to load the local JSON file
                child: FutureBuilder(
                    future: DefaultAssetBundle
                        .of(context)
                        .loadString('asserts/name_data.json'),
                    builder: (context, snapshot) {
                      // Decode the JSON
                      var new_data = json.decode(snapshot.data.toString());
    
                      return ListView.builder(
                        // Build the ListView
                        itemBuilder: (BuildContext context, int index) {
                          return Card(
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.stretch,
                              children: <Widget>[
                                Text("Name: " + new_data[index]['name']),
                                Text("Height: " + new_data[index]['height']),
                                Text("Mass: " + new_data[index]['mass']),
                                Text(
                                    "Hair Color: " + new_data[index]['hair_color']),
                                Text(
                                    "Skin Color: " + new_data[index]['skin_color']),
                                Text(
                                    "Eye Color: " + new_data[index]['eye_color']),
                                Text(
                                    "Birth Year: " + new_data[index]['birth_year']),
                                Text("Gender: " + new_data[index]['gender'])
                              ],
                            ),
                          );
                        },
                        itemCount: new_data == null ? 0 : new_data.length,
                      );
                    }),
              ),
            ));
      }
    }
    
    
    总结:建议使用[DefaultAssetBundle]来获取当前BuildContext的AssetBundle。 这种方法不是使用应用程序构建的默认 asset bundle,而是使父级widget在运行时替换的不同的 AssetBundle,这对于本地化或测试场景很有用。

    相关文章

      网友评论

        本文标题:Flutter 中获取本地 json 并解码 (附官方示例代码)

        本文链接:https://www.haomeiwen.com/subject/qokhqktx.html