英文:
Is it normal to have long files while working with flutter?
问题
我正在通过制作一个网站来学习Flutter，我注意到一些我在网上找到的示例只有一个或两个非常长的.dart文件。我熟悉React，习惯了在不同的文件中编写组件，然后在需要时导出它们，因此我最终会有几个短文件。
在Flutter中只有长文件可以吗，还是我必须遵循与React相同的做法？如果是这样，最佳方法是什么？提前感谢。
英文:
Im learning flutter by making a website and I have noticed that some of the examples I have found online have just one or two really long .dart files. I am familiar with React and Im used to coding components in different files and then exporting them when needed, so I end up with several short files.
Is it okay to just have long files on flutter or do I have to follow the same React practices? If so, what is the best way to do so? Thanks in advance.
答案1
得分: 1
如果您遵循良好的实践，对您和团队成员都是最好的。
一些减少文件中代码的实践包括使用视图和控制器范例，以及创建单独的小部件。
- 在视图-控制器中，您需要为一个屏幕创建两个文件，一个是视图，其中包含小部件函数，即它具有纯UI，而控制器则包含所有业务逻辑，如状态管理、不同的计算等。视图将成为控制器状态的混合体，如下所示，并且具有小部件按钮，您可以从控制器中使用它并传递所需的字段。
mixin HomeScreenView on State<HomeScreenController> {
Widget okButton(
{required void Function()? onPressed, required String buttonText}) {
return ElevatedButton(onPressed: onPressed, child: Text(buttonText));
}
}
class _HomeScreenControllerState extends State<HomeScreenController>
with HomeScreenView {
@override
Widget build(BuildContext context) {
return Center(
child: okButton(onPressed: () {}, buttonText: 'Ok'),
);
}
}
而控制器状态将扩展混合体，如下所示：
class _HomeScreenControllerState extends State<HomeScreenController>
with HomeScreenView {
// 状态的其他实现和逻辑
}
- 正如名称所示，创建单独的小部件意味着创建有状态或大部分无状态小部件。
class OkButton extends StatelessWidget {
const OkButton(
{super.key, required this.buttonText, required this.onPressed});
final String buttonText;
final void Function()? onPressed;
@override
Widget build(BuildContext context) {
return ElevatedButton(onPressed: onPressed, child: Text(buttonText));
}
}
在这里，您只需创建一个独立的小部件，然后在其他文件中使用它。
英文:
If you follow the good practices it would be best for you and fellow teammates.
Some practices to reduce the code from the files are using View and Controller paradigm other is making separate widgets.
-
In the View-Controller, there you make a two files for a screen one is View which consists of the widgets function means it has the pure UI and Controller have all the business logic like your state management, your different computations and all. View will be the mixin on state of the the controller like below and have the widget button and use it from the cntroller and pass the required fields.
mixin HomScreenView on State<HomeScreenController> { Widget okButton( {required void Function()? onPressed, required String buttonText}) { return ElevatedButton(onPressed: onPressed, child: Text(buttonText)); } }where as controller state will extend the mixin like below:
class _HomeScreenControllerState extends State<HomeScreenController> with HomeScreenView { @override Widget build(BuildContext context) { return Center( child: okButton(onPressed: () {}, buttonText: 'Ok'), ); } } -
And as the name says making separate widgets means making Stateful or mostly Stateless widgets.
class OkButton extends StatelessWidget { const OkButton( {super.key, required this.buttonText, required this.onPressed}); final String buttonText; final void Function()? onPressed; @override Widget build(BuildContext context) { return ElevatedButton(onPressed: onPressed, child: Text(buttonText)); } }Here you just make a separate widget and use it in your other files.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论