Flutter: Stateful 挂件 vs Stateless 挂件

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Flutter: Stateful 挂件 vs Stateless 挂件相关的知识,希望对你有一定的参考价值。

Flutter 一切皆挂件。如果你想开发一个应用,首先,你得知道你需要使用哪种挂件。每个挂件都有它的状态。

状态是什么?

状态就是在构建小挂件时可以同时读取信息,并且可能在运行时更改信息。简而言之,我们可以说 ​​State​​​ 定义了 ​​Widget​​ 的当前属性。

继承 ​​Stateful​​​ 挂件的类是不可变的,但是 ​​State​​ 是可变的。

不可变的类 意味着一旦对象被创建,我们不可以改变它的内容。可变的类 是指一旦它被创建,我们还是可以更改它内部的状态。

Flutter:

应用 Stateful 挂件的步骤

  1. 通过继承​​StatefulWidget​​​ 去创建一个类,然后在​​createState()​​ 方法中返回状态
  2. 创建​​State​​ 类挂件可能在运行时候更改它的值
  3. 在​​State​​​ 类中,应用​​build()​​ 方法
  4. 调用​​setState()​​​ 方法。​​setState()​​ 方法实际上是重绘挂件。

代码示例

Flutter:

应用 Stateless 挂件的步骤

  1. 通过继承​​StatelessWidget​​ 去创建一个类
  2. 为挂件创建一个​​build()​​ 方法,在个关键在运行时不更改其内容
  3. ​build()​​ 方法中返回挂件

代码示例

Flutter:

完整的代码和输出

import package:flutter/material.dart;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget
// This widget is the root of your application.
@override
Widget build(BuildContext context)
return MaterialApp(
debugShowCheckedModeBanner: false,
title: Flutter Demo,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Home(),
);



class Home extends StatefulWidget
@override
_HomeState createState() => _HomeState();


class _HomeState extends State<Home>
String name = "";
@override
Widget build(BuildContext context)
return SafeArea(
child: Scaffold(
appBar: AppBar(
title: Text("Stateful Widget Vs. Stateless Widget"),
centerTitle: true,
),
body: Center(
child: Container(
width: 300,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextField(
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: Enter your name,
),
onSubmitted: (String str)
setState(()
name = str;
);
,
),
Text("Hello $name!"),
Greet(),
],
),
),
),
),
);



class Greet extends StatelessWidget
@override
Widget build(BuildContext context)
return RaisedButton(
child: Text("Nice to meet you"),
);

Flutter:

本文是译文,采用意译的方式。原文链接 levelup.gitconnected.com/flutter-sta…

以上是关于Flutter: Stateful 挂件 vs Stateless 挂件的主要内容,如果未能解决你的问题,请参考以下文章

从 Flutter 中的 Stateful Widget 返回数据

Flutter控件篇(Stateful widget)——ListView

Flutter - Stateful(有状态) 和 stateless(无状态) widgets

区别:@SessionScoped vs @Stateful 和 @ApplicationScoped vs @Singleton [关闭]

Flutter Stateful Widget 状态未初始化

跨多个屏幕使用的 Flutter Stateful Widget 正在重建