在开发中，我们经常会使用本地JSON或者从服务器请求数据后回去到JSON，拿到JSON后通常会将JSON转成Model对象来进行后续的操作，因为这样操作更加的方便，也更加的安全。

所以学习JSON的相关操作以及读取JSON后如何转成Model对象对于Flutter开发也非常重要。

1. JSON资源配置

JSON也属于一种资源，所以在使用之前需要先进行相关的配置

2. JSON读取解析

2.1 JSON资源读取

如果我们希望读取JSON资源，可以使用package:flutter/services.dart包中的rootBundle。
在rootBundle中有一个loadString方法，可以去加载JSON资源

2.2 JSON字符串转化

拿到JSON字符串后，我们需要将其转成成我们熟悉的List和Map类型。
我们可以通过dart:convert包中的json.decode方法将其进行转化

Future<List<Anchor>> getAnchors() async {
    //1. 读取json文件
    String jsonString = await rootBundle.loadString("assets/test.json");
    //2.转成List或Map类型
    final jsonResult = json.decode(jsonString);
    //遍历List，并且转成Anchor对象放到另一个List中
    List<Anchor> anchors = new List();
    for(Map<String,dynamic> map in jsonResult) {
      anchors.add(Anchor.withMap(map));
    return anchors;
2.3 对象Model定义
将JSON转成了List和Map类型后，就可以将List中的一个个Map转成Model对象，所以我们需要定义自己的Model
import 'package:flutter/services.dart' show rootBundle;
import 'dart:convert';
import 'dart:async';
class Anchor {
  String nickName;
  String roomName;
  String imageUrl;
  Anchor({
    this.nickName,
    this.roomName,
    this.imageUrl
  Anchor.withMap(Map<String,dynamic> parseMap) {
    this.nickName = parseMap["nickName"];
    this.roomName = parseMap["roomName"];
    this.imageUrl = parseMap["roomSrc"];
  Future<List<Anchor>> getAnchors() async {
    //1. 读取json文件
    String jsonString = await rootBundle.loadString("assets/test.json");
    //2.转成List或Map类型
    final jsonResult = json.decode(jsonString);
    //遍历List，并且转成Anchor对象放到另一个List中
    List<Anchor> anchors = new List();
    for(Map<String,dynamic> map in jsonResult) {
      anchors.add(Anchor.withMap(map));
    return anchors;
  @override
  String toString() {
    return "$nickName - $roomName : $imageUrl";
3. JSON解析代码
这里我单独创建了一个anchor.dart的文件，在其中定义了所有的相关代码：
之后外界只需要调用我内部的getAnchors就可以获取到解析后的数据了
import 'package:flutter/material.dart';
import 'anchor.dart';
main(List<String> args) {
  runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("HelloWorld"),
        body: MyHomeBody(),
class MyHomeBody extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var future = Anchor().getAnchors();
    future.then((value) {
      print(value.toString());
    }).catchError((error) {
      // 捕获出现异常时的情况
      print(error);
    return Center(child: Text("json文件读取"));