flutter - 如何使用 ValueKey 为页面设置键？

Question

我正在按照本教程向我的应用程序添加导航： https ://medium.com/flutter/learning-flutters-new-navigation-and-routing-system-7c9068155ade

我不明白如何为页面创建密钥。我做了一些谷歌搜索。我收到的错误消息意味着该参数必须是编译时常量，但这没有任何意义。

教程中对我不起作用但在教程中起作用的部分，因为书籍列表是编译时常量：

class BookDetailsPage extends Page {
  final Book book;

  BookDetailsPage({
    this.book,
  }) : super(key: ValueKey(book));

我不想硬编码书籍列表，我希望应用程序通过书籍 ID 查找书籍。用户可以提供任意书籍 ID。

class MyBookDetailsPage extends Page {
  final int bookId;

  const MyBookDetailsPage({@required this.bookId})
      : super(key: ValueKey(bookId));

但我得到一个错误

lib/main.dart:311:20: Error: Constant expression expected.
Try inserting 'const'.
      : super(key: ValueKey(bookId));
                   ^^^^^^^^
lib/main.dart:311:20: Error: Constant evaluation error:
      : super(key: ValueKey(bookId));
                   ^
lib/main.dart:311:29: Context: The variable 'bookId' is not a constant, only constant expressions are allowed.
      : super(key: ValueKey(bookId));
                            ^

添加const没有帮助。

一定有很多ValueKey我不明白的地方。请帮忙！

标签： flutterflutter-navigation

Answer 1

如果在重建时传入的参数ValueKey()相同，那么小部件将不会重建，因为 Flutter 现在知道这个小部件有一个标签。

children: <Widget>[
  if (showFirst) MyTextField(key: ValueKey(1),),
  MyTextField(key: ValueKey(2)),
],

在这里，我们可以看到ValueKey我们设置为整数 1、2 的参数。我们可以自由选择任何参数作为参数，但在重建时它不应该改变。

如果您运行这些更改，结果将如下所示：