【Flutter 问题系列第 31 篇】在 Flutter 中如何获取本地的 json 文件并解码
本文已参与「新人创作礼」活动,一起开启创作之路。
这是【Flutter 问题系列第 31 篇】,如果觉得有用的话,欢迎关注专栏。
在 Flutter 中获取本地的 json 文件,博文中提供两种方式。这里先在路径 "assets/config/anime.json"
下新建本地的 json 文件,如下图所示
然后在 pubspec.yaml
配置文件中添加如下内容
接下来是如何获取本地 json 文件。
方式一 : rootBundle.loadString
可以使用 rootBundle.loadString
的方式获取本地 json 文件。如下代码所示
List _animes = []; // 动漫列表
@override
void initState() {
rootBundle.loadString("assets/config/anime.json").then((value) {
var map = json.decode(value); // 解码
_animes = map["animes"]; // 列表赋值
});
super.initState();
}
然后直接遍历数组即可,如下代码所示(已省去无关代码)
..._animes.map(
(e) => Row(
children: <Widget>[Text("${e['id']}"), Text(e['name'])],
),
)
效果图如下所示
方式二 : DefaultAssetBundle.of(context).loadString
使用 DefaultAssetBundle.of(context).loadString
的方式获取本地 json 文件。
最终的效果和方式一是一样的,直接上代码
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("加载本地json文件")),
body: FutureBuilder(
future: DefaultAssetBundle.of(context).loadString("assets/config/anime.json"),
builder: (BuildContext context, AsyncSnapshot snapshot) {
var map = json.decode(snapshot.data.toString());
_animes = map["animes"]; // 列表赋值
// 因为获取 json 文件是异步的,如果还没有获取到数据,则显示 loading 组件
if (snapshot.connectionState != ConnectionState.done) {
return Center(child: CircularProgressIndicator());
}
return Card(
child: Column(
children: _animes
.map((e) => Row(children: <Widget>[Text("${e['id']}"), Text(e['name'])]))
.toList(),
),
);
},
),
);
}
两种方式的区别
关于这两种加载本地 json 文件的区别,以下两条是我找到的相关资料,仅供参考
- 通过 rootBundle 对象加载:每个 Flutter 应用程序都有一个 rootBundle 对象,通过它可以轻松访问主资源包,直接使用 package:flutter/services.dart 中全局静态的 rootBundle 对象来加载 asset 即可。
- 通过 DefaultAssetBundle 加载:建议使用 DefaultAssetBundle 来获取当前 BuildContext 的 AssetBundle。 这种方法不是使用应用程序构建的默认 asset bundle,而是使父级 widget 在运行时动态替换的不同的 AssetBundle,这对于本地化或测试场景很有用。
关于如何在 Flutter 中获取本地的 json 文件,便介绍到这里。
你的问题得到解决了吗?欢迎在评论区留言。
赠人玫瑰,手有余香,如果觉得文章不错,希望可以给个一键三连,感谢。
结束语
Google 的 Flutter 越来越火,截止 2021年7月12日 GitHub 标星已达 124K,Flutter 毅然是一种趋势,所以作为前端开发者,没有理由不趁早去学习。
无论你是 Flutter 新手还是已经入门了,不妨先点个关注,后续我会将 Flutter 中的常用组件(含有源码分析、组件的用法及注意事项)以及可能遇到的问题写到稀土博客中,希望自己学习的同时,也可以帮助更多的人。