flutter鸿蒙版本数据处理常用总集

简介: 本文介绍了在 Flutter 中如何本地访问 JSON 文件,包括确保文件路径正确、更新 `pubspec.yaml` 配置、正确加载 JSON 文件的方法。同时,详细讲解了如何在 Flutter 中使用 `dart:convert` 库进行 JSON 与 Map、Dart 对象之间的相互转换,提供了多个示例代码,帮助读者更好地理解和应用这些技术。

写在前面
本地访问json

  1. 确保文件路径正确
    示例目录
    确保文件 one.json 实际上位于项目的 assets/json/ 目录中。项目结构应该类似于:

your_flutter_project/
│
├── assets/
│ └── json/
│ └── one.json
│
├── lib/
│ └── main.dart
│
└── pubspec.yaml

  1. 更新pubspec.yaml
    确保在pubspec.yaml中注册资产的路径。请检查以下内容:

确保pubspec.yaml文件的缩进是正确的(YAML文件对缩进非常敏感)。也要确保没有多余的空格和其他格式错误。

flutter:
assets:

- assets/json/one.json
  1. 正确加载JSON文件
    在现有的代码中,loadString是一个异步方法,因此应该使用async和await来加载文件。以下是更新后的代码:

import 'dart:convert'; // 添加这一行以便使用 json.decode
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Bottom Navigation',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: HomePage(),
);
}
}

class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}

class _HomePageState extends State {
String jsonResponse = '';

@override
void initState() {
super.initState();
loadJsonData();
}

Future loadJsonData() async {
try {
// 使用await加载JSON数据
final String response = await rootBundle.loadString('assets/json/one.json');
setState(() {
jsonResponse = response; // 将加载的JSON数据保存到变量中
});
print(jsonResponse); // 输出JSON内容
} catch (e) {
print("Error loading JSON: $e");
}
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Flutter Bottom Navigation'),
),
body: Container(
child: Text(jsonResponse.isNotEmpty ? jsonResponse : "Loading..."),
),
);
}
}

JSON转Map
在 Flutter 中,可以使用 dart:convert 库中的 jsonDecode 方法将 JSON 字符串转换为 Map。

示例代码
import 'dart:convert';
void main() {
// JSON 字符串
String jsonString = '{"name": "John", "age": 30}';
// JSON 转换为 Map
Map userMap = jsonDecode(jsonString);
// 打印结果
print(userMap); // 输出: {name: John, age: 30}
}
在上面的示例中,我们定义了一个 JSON 字符串,并使用 jsonDecode 方法将其转换为 Map。输出结果是一个包含键值对的 Map。

Map转JSON
要将 Map 转换为 JSON 字符串,我们同样可以使用 dart:convert 库中的 jsonEncode 方法。

示例代码
import 'dart:convert';
void main() {
// 定义一个 Map
Map userMap = {
'name': 'John',
'age': 30
};
// Map 转换为 JSON
String jsonString = jsonEncode(userMap);
//打印结果
print(jsonString); // 输出: {"name":"John","age":30}
}
在此示例中,我们创建了一个 Map,然后使用 jsonEncode 将其转换为 JSON 字符串。输出是有效的 JSON 格式。

JSON转对象
要将 JSON 字符串转换为 Dart 对象,我们需要定义一个类,并在类中实现一个工厂构造函数,以便从 Map 创建对象。

示例代码
import 'dart:convert';
// 定义 User 类
class User {
final String name;
final int age;
User({required this.name, required this.age});
// 从 Map 创建 User 对象
factory User.fromJson(Map json) {
return User(
name: json['name'],
age: json['age'],
);
}
}
void main() {
// JSON 字符串
String jsonString = '{"name": "John", "age": 30}';
// 将 JSON 字符串转换为 Map
Map userMap = jsonDecode(jsonString);
// 创建 User 对象
User user = User.fromJson(userMap);
// 打印结果
print('Name: ${user.name}, Age: ${user.age}'); // 输出: Name: John, Age: 30
}

在这个例子中,我们定义了一个 User 类,并实现了 fromJson 工厂构造函数。我们首先将 JSON 字符串转换为 Map,然后使用 User.fromJson 方法创建 User 对象。

对象转JSON
要将 Dart 对象转换为 JSON 字符串,我们需要在类中实现一个方法,将对象的属性转换为 Map,然后使用 jsonEncode 方法进行编码。

示例代码
import 'dart:convert';
// 定义 User 类
class User {
final String name;
final int age;
User({required this.name, required this.age});

// 将 User 对象转换为 Map
Map toJson() {
return {
'name': name,
'age': age,
};
}
}
void main() {
// 创建 User 对象
User user = User(name: 'John', age: 30);
// 将 User 对象转换为 JSON 字符串
String jsonString = jsonEncode(user.toJson());
// 打印结果
print(jsonString); // 输出: {"name":"John","age":30}
}

在这个示例中,我们定义了 toJson 方法,它将 User 对象的属性转换为 Map。然后,我们使用 jsonEncode 将 Map 转换为 JSON 字符串。

写在最后
在 Flutter 中,处理 JSON、Map 和 Dart 对象之间的转换是非常重要的技能。通过使用 dart:convert 库中的 jsonDecode 和 jsonEncode 方法,我们可以轻松实现 JSON 和 Map 之间的转换,以及 JSON 和 Dart 对象之间的转换。掌握这些基本操作将使你能够更高效地处理应用程序中的数据。

希望这篇博客能帮助你更好地理解 Flutter 中的 JSON 处理方法!
————————————————

                        版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

原文链接:https://blog.csdn.net/lbcyllqj/article/details/142865249

目录
相关文章
鸿蒙开发:V2版本装饰器@Once
@Once装饰器只能与@Param搭配使用,仅此一个组合,无其他使用方式,还有就是,必须在V2版本,也就是@ComponentV2装饰的自定义组件中,否则会报异常。
381 7
鸿蒙开发:V2版本装饰器@Once
|
API
HarmonyOS 3.1/4项目在DevEco Studio 5.0(HarmonyOS NEXT)版本下使用的问题
有读者在使用《鸿蒙HarmonyOS应用开发入门》书中的源码时遇到问题,主要原因是使用的DevEco Studio版本不同所致。本文提供了三种解决方案:1) 降级DevEco Studio至3.1版本;2) 按照5.0版本修改书中示例;3) 等待并使用《鸿蒙之光HarmonyOS NEXT原生应用开发入门》升级版书籍。
1433 1
|
人工智能 监控 Java
一文搞清楚HarmonyOS NEXT中状态管理 V1 版本:父子组件数据传递装饰器的奇妙之旅
本文深入浅出地介绍了HarmonyOS NEXT开发中状态管理V1版本的两个核心装饰器:@Prop和@Link。@Prop如同单向传递的快递员,负责将数据从父组件传递到子组件,但子组件的修改不会影响父组件;@Link则像心灵感应的双胞胎,实现父组件与子组件间的数据双向同步。通过魔法按钮和能量水晶的生动示例,文章详细解析了两者的使用场景、参数特性及同步机制,并以浅拷贝和深拷贝为比喻,帮助开发者更好地理解数据传递中的细节。掌握这两位“信使”,能让组件间的协作更加高效可靠!
659 14
一文搞清楚HarmonyOS NEXT中状态管理 V1 版本:父子组件数据传递装饰器的奇妙之旅
|
前端开发 Java Shell
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
1176 20
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
缓存 Java 测试技术
【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
2366 3
【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
|
Dart 前端开发 IDE
鸿蒙Flutter实战:14-现有Flutter 项目支持鸿蒙 II
本文介绍了如何将现有 Flutter 项目适配鸿蒙系统,详细步骤包括安装 FVM、使用 FVM 安装 Flutter SDK、搭建开发环境、创建项目架构和壳工程等。
1648 7
鸿蒙Flutter实战:14-现有Flutter 项目支持鸿蒙 II
【HarmonyOS Next】状态管理V2版本使用详解
现阶段状态管理V2版本还在试用阶段,但是切实解决了很多在项目中使用V1导致的痛点问题,比如: * 同一数据被多视图代理时,无法同步数据修改。 * 无法做到深度观测和深度监听。 * 更新对象中某个数据时,会导致整个对象属性都刷新,导致程序运行缓慢。
726 4
【HarmonyOS Next】状态管理V2版本使用详解
|
API 开发者
鸿蒙开发:V2版本装饰器之@Monitor装饰器
如果要实现@Monitor监听,其变量一定要被@Local、@Param、@Provider、@Consumer、@Computed装饰,未被修饰则无法被监听,还有,如果监听对象的变化,则不建议在一个类中对同一个属性进行多次@Monitor的监听,多次监听,只有最后一个定义的监听方法才会有效。
418 2
|
存储 调度 数据安全/隐私保护
鸿蒙Flutter实战:13-鸿蒙应用打包上架流程
鸿蒙应用打包上架流程包括创建应用、打包签名和上传应用。首先,在AppGallery Connect中创建项目、APP ID和元服务。接着,使用Deveco进行手动签名,生成.p12和.csr文件,并在AppGallery Connect中上传CSR文件获取证书。最后,配置签名并打包生成.app文件,上传至应用市场。常见问题包括检查签名配置文件是否正确。参考资料:[应用/服务签名](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/ide-signing-V5)。
1674 3
鸿蒙Flutter实战:13-鸿蒙应用打包上架流程
|
开发工具 芯片 开发者
鸿蒙Flutter实战:12-使用模拟器开发调试
本文介绍了如何在 M 系列芯片的 Mac 电脑上使用模拟器进行鸿蒙 Flutter 开发和调试。主要内容包括:创建 Flutter 项目、签名、创建模拟器、运行 Flutter 项目以及常见问题的解决方法。适用于希望在鸿蒙系统上开发 Flutter 应用的开发者。
909 2
鸿蒙Flutter实战:12-使用模拟器开发调试

热门文章

最新文章