dart - Flutter/dart 中的 widget.something 实际调用了什么？

Question

我见过人们通过以下方式访问某些变量：widget.something. widget.实际上在做什么？它参考什么。

例如（我正在处理的一些随机代码）：

import 'package:flutter/material.dart';
import 'Constants.dart';
import 'Lesson.dart';
import 'StaticMethods.dart';
import 'DetailPage.dart';
import 'package:garuda_academy_app/Authentication.dart';

class LessonPage extends StatefulWidget {
  LessonPage({Key key, this.auth, this.userId, this.onSignedOut, this.title}) : super(key: key);

  final String title;

  final BaseAuth auth;
  final VoidCallback onSignedOut;
  final String userId;

  @override
  _LessonPageState createState() => _LessonPageState();
}

class _LessonPageState extends State<LessonPage> {
  List lessons;

  @override
  void initState() {
    lessons = StaticMethods.getLessons();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    ListTile makeListTile(Lesson lesson) => ListTile(
          contentPadding:
              EdgeInsets.symmetric(horizontal: 20.0, vertical: 10.0),
          leading: Container(
            padding: EdgeInsets.only(right: 12.0),
            decoration: new BoxDecoration(
                border: new Border(
                    right: new BorderSide(width: 1.0, color: Colors.white24))),
            child: IconButton(
              icon: Icon(Icons.file_download, color: Colors.white),
              onPressed: (){},
            ),
          ),
          title: Text(
            lesson.title,
            style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
          ),

          subtitle: Row(
            children: <Widget>[
              Expanded(
                  flex: 1,
                  child: Container(
                    child: LinearProgressIndicator(
                        backgroundColor: Color.fromRGBO(209, 224, 224, 0.2),
                        value: lesson.indicatorValue,
                        valueColor: AlwaysStoppedAnimation(Colors.green)),
                  )),
              Expanded(
                flex: 4,
                child: Padding(
                    padding: EdgeInsets.only(left: 10.0),
                    child: Text(lesson.level,
                        style: TextStyle(color: Colors.white))),
              )
            ],
          ),
          trailing:
              Icon(Icons.keyboard_arrow_right, color: Colors.white, size: 30.0),
          onTap: () {
            Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => DetailPage(lesson: lesson)));
          },
        );

    Card makeCard(Lesson lesson) => Card(
          elevation: 8.0,
          margin: new EdgeInsets.symmetric(horizontal: 10.0, vertical: 6.0),
          child: Container(
            decoration: BoxDecoration(color: Color.fromRGBO(64, 75, 96, .9)),
            child: makeListTile(lesson),
          ),
        );

    final makeBody = Container(
      child: ListView.builder(
        scrollDirection: Axis.vertical,
        shrinkWrap: true,
        itemCount: lessons.length,
        itemBuilder: (BuildContext context, int index) {
          return makeCard(lessons[index]);
        },
      ),
    );

    final makeBottom = Container(
      height: 55.0,
      child: BottomAppBar(
        color: Color.fromRGBO(58, 66, 86, 1.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: <Widget>[
            IconButton(
              icon: Icon(Icons.school, color: Colors.white),
              onPressed: () => StaticMethods.goToWidget(context, new LessonPage(title: LESSON_PAGE_TITLE, userId: widget.userId, ,)),
            ),
            IconButton(
              icon: Icon(Icons.flight_takeoff, color: Colors.white),
              onPressed: () {},
            ),
            IconButton(
              icon: Icon(Icons.account_box, color: Colors.white),
              onPressed: () {},
            )
          ],
        ),
      ),
    );
    final topAppBar = AppBar(
      elevation: 0.1,
      backgroundColor: Color.fromRGBO(58, 66, 86, 1.0),
      title: Text(widget.title),
      automaticallyImplyLeading: false,
    );

    return Scaffold(
      backgroundColor: Color.fromRGBO(58, 66, 86, 1.0),
      appBar: topAppBar,
      body: makeBody,
      bottomNavigationBar: makeBottom,
    );
  }
}

如果你注意到topAppBar 一直在底部使用widget.title。现在这是从 访问标题LessonPage，我没有得到。访问究竟是什么widget.something？

标签： dartflutter

Answer 1

如果您看到State<T extends StatefulWidget>内部 framework.dart 文件的代码，您会发现它widget只不过是私有类变量的 getter _widget。

框架.dart

abstract class State<T extends StatefulWidget> extends Diagnosticable {
  T get widget => _widget;
  T _widget;
}

抽象类State定义widget属性 getter 如下 -

一个State对象的配置就是对应的StatefulWidget 实例。该属性在调用之前由框架初始化 initState。如果父级将树中的此位置更新为具有与当前配置相同的新小部件runtimeType，Widget.key框架将更新此属性以引用新小部件，然后调用didUpdateWidget，将旧配置作为参数传递。

---

简而言之，类的widget属性State定义了StatefulWidget您State所指的当前，因此它可用于访问 的运行时属性StatefulWidget，正如您在示例中看到的那样，它可以是 from titleto的值之一userId。

希望这可以帮助！