在开始之前,让我们回顾一下控制器的概念,以下是 tutorialspoint.com 的快速摘要。
控制器负责控制应用程序逻辑,并充当视图和模型之间的协调器。 控制器通过视图接收来自用户的输入,然后在模型的帮助下处理用户的数据,并将结果传递回视图。
带服务的控制器。
class HomeController extends Controller {
AnalyticsService analyticsService;
NotificationService notificationService;
@override
construct(BuildContext context) {
// 服务
analyticsService = AnalyticsService();
notificationService = NotificationService();
}
bool sendMessage(String message) async {
bool success = await this.notificationService.sendMessage(message);
if (success == false) {
this.analyticsService.sendError("failed to send message");
}
return success;
}
onTapDocumentation() {
launch("https://nylo.dev/docs");
}
从页面调用控制器。
class MyHomePage extends NyPage<HomeController> {
...
MaterialButton(
child: Text("Documentation"),
onPressed: controller?.onTapDocumentation, // 调用事件
),
或从小部件。
class _MyHomePageState extends NyState<MyHomePage> {
...
MaterialButton(
child: Text("Documentation"),
onPressed: widget.controller.onTapDocumentation, // 调用事件
),
如果组件具有控制器,则可以使用widget.controller访问其属性。
可以使用命令 dart run nylo_framework:main make:page account --controller 自动创建新页面和控制器。
1. 创建页面和控制器
您可以使用Metro CLI工具自动创建页面和控制器。
dart run nylo_framework:main make:page dashboard_page --controller
// 或者
dart run nylo_framework:main make:page dashboard_page -c
这将在app/controllers目录中创建一个新控制器,并在resources/pages目录中创建一个页面。
或者,可以使用以下命令创建单个控制器。
dart run nylo_framework:main make:controller profile_controller
从路由中检索参数:如果需要将数据从一个组件传递到另一个组件,可以使用Navigator类或使用routeTo发送数据。
// 从另一个页面发送一个对象
User user = new User();
user.firstName = 'Anthony';
Navigator.pushNamed(context, '/profile', arguments: user);
// 或者
routeTo(ProfilePage.path, data: user);
当我们导航到“Profile”页面时,我们可以调用 data() 以从上一页获取数据。
class ProfilePage extends NyPage {
@override
init() async {
super.init();
dynamic data = data(); // 从上一页传递的数据
User user = data;
print(user.firstName); // Anthony
}
或从 StatefulWidget
class _ProfilePageState extends NyState<ProfilePage> {
@override
init() async {
super.init();
dynamic data = widget.data(); // 从上一页传递的数据
User user = data;
print(user.firstName); // Anthony
}
routeTo(String routeName, data: dynamic) 数据参数接受动态类型,因此可以在返回对象后对其进行转换。
2. 将控制器与 NyPage 配合使用
NyPage 小部件使控制器易于使用。
可以通过先扩展 NyPage 类,然后设置控制器来使用控制器,如以下示例所示。
import 'package:nylo_framework/nylo_framework.dart';
import '/app/controllers/my_controller.dart'; // 导入控制器
class HomePage extends NyPage<MyController> {
// 页面创建时初始化
init() async {
// access the controller
controller.doSomething(); // 调用控制器事件
controller.data(); // 从上一页传递的数据
controller.queryParameters(); // query parameters passed from a previous page
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("My Page"),
),
body: Center(
child: Text("Hello World"),
),
);
}
}
请务必在 config/decoders.dart 文件中设置控制器,如以下示例所示。
import 'package:nylo_framework/nylo_framework.dart';
...
final Map<Type, BaseController> controllers = {
HomeController: HomeController(),
MyNewController: MyNewController(), // 新控制器
// ...
};
您还应该将所有控制器添加到 Nylo,如以下示例所示:
1). 打开 app/providers/app_provider.dart
2). 添加控制器
import 'package:nylo_framework/nylo_framework.dart';
...
class AppProvider implements NyProvider {
@override
boot(Nylo nylo) async {
...
nylo.addControllers(controllers); // 控制器添加到 Nylo
return nylo;
}
...
现在,您应该可以在 NyPage 中使用控制器了.