More
在 Flutter 中使用 Back4app 后端理解模式匹配
9 分
介绍 模式匹配是dart 3中引入的一个强大特性,它允许开发者轻松识别和提取应用程序中的特定数据结构。如果你有kotlin、swift或javascript等语言的经验,你可能已经熟悉模式匹配。然而,如果你对dart中的这个概念不熟悉,本教程将帮助你熟悉它。我们将探索模式匹配以及如何在flutter应用中使用它,提供一个实际示例,将back4app作为后端来管理和存储数据。 先决条件 在开始之前,请确保你具备以下条件: 一个back4app账户。请在 back4app com https //www back4app com 注册一个免费账户。 在本地机器上设置flutter开发环境。如果你还没有设置,请遵循 flutter安装指南 https //flutter dev/docs/get started/install 。 对dart、flutter小部件和使用back4app进行后端服务的基本知识。 步骤1 – 设置你的back4app后端 创建一个back4app项目 登录到你的 back4app账户 https //www back4app com/ 并创建一个新项目。 创建解析类 对于本教程,创建一个名为 userdata 的解析类来存储用户信息: 用户名 (字符串):用户的用户名。 年龄 (数字):用户的年龄。 偏好设置 (json):存储用户偏好的json对象。 获取你的back4app凭据 导航到你的项目设置以检索你的应用程序id和客户端密钥,这些是连接你的flutter应用到back4app所需的。 步骤 2 – 设置 flutter 项目 创建一个新的 flutter 项目 打开终端或命令提示符并运行 flutter create pattern matching example 添加依赖 打开 pubspec yaml 并添加以下依赖 dependencies flutter sdk flutter parse server sdk flutter latest version 运行 flutter pub get 来安装这些依赖 在您的应用中初始化 parse 在 lib/main dart , 初始化 parse sdk import 'package\ flutter/material dart'; import 'package\ parse server sdk flutter/parse server sdk flutter dart'; void main() async { widgetsflutterbinding ensureinitialized(); const keyapplicationid = 'your back4app app id'; const keyclientkey = 'your back4app client key'; const keyparseserverurl = 'https //parseapi back4app com'; await parse() initialize(keyapplicationid, keyparseserverurl, clientkey keyclientkey, autosendsessionid true); runapp(myapp()); } class myapp extends statelesswidget { @override widget build(buildcontext context) { return materialapp( home patternmatchingscreen(), ); } } 将 'your back4app app id' 和 'your back4app client key' 替换为您的实际 back4app 凭据。 步骤 3 – 实现模式匹配 创建 patternmatchingscreen 小部件 在 lib/main dart , 创建一个新的小部件,通过检索和处理用户数据来演示模式匹配 class patternmatchingscreen extends statefulwidget { @override patternmatchingscreenstate createstate() => patternmatchingscreenstate(); } class patternmatchingscreenstate extends state\<patternmatchingscreen> { string message = 'fetching data '; @override void initstate() { super initstate(); fetchandmatchdata(); } future\<void> fetchandmatchdata() async { final query = querybuilder\<parseobject>(parseobject('userdata')); final response = await query query(); if (response success && response results != null) { for (var result in response results!) { // using pattern matching to destructure and validate data if (result is parseobject) { final userdata = { 'username' result get\<string>('username'), 'age' result get\<int>('age'), 'preferences' result get\<map\<string, dynamic>>('preferences') }; switch (userdata) { case { 'username' string name, 'age' int age when age >= 18, 'preferences' {'theme' string theme} } setstate(() { message = 'welcome, $name! you are $age years old and prefer the $theme theme '; }); break; default setstate(() { message = 'data does not match the required pattern '; }); break; } } } } else { setstate(() { message = 'failed to retrieve data '; }); } } @override widget build(buildcontext context) { return scaffold( appbar appbar(title text('pattern matching example')), body center(child text( message)), ); } } 这段代码从 back4app 获取用户数据,应用模式匹配来验证和解构数据,然后根据匹配的数据显示个性化消息。 步骤 4 – 运行应用程序 运行你的应用程序 使用 flutter run 你应该在屏幕上看到一条基于检索和匹配的数据的消息。 通过登录到你的 back4app 控制面板并检查 userdata 类来验证数据 。你可以调整数据以查看不同模式如何匹配以及应用程序如何响应。 结论 在本教程中,我们探讨了 dart 中的模式匹配概念以及如何在 flutter 应用程序中应用它。通过将 back4app 集成作为后端,我们展示了一个使用模式匹配获取和处理数据的实际示例。这种方法使你能够高效地验证和解构数据,使你的 flutter 应用程序更加健壮和可维护。 有关 dart 模式的更多信息,请访问 dart 文档 https //dart dev ,有关后端集成技巧,请查看 back4app 文档 https //www back4app com/docs 。祝你编码愉快!