未使用级联操作符的WebViewController在Flutter中为何报错？

这是Dart语法规则限制导致的问题，具体原因和解决方案如下：

核心原因 #

在Dart类的成员声明区域（类中直接定义变量、方法的位置），只能编写变量初始化表达式、方法/构造函数定义，不能直接执行独立的语句（比如调用对象方法）。

两种写法的差异 #

1. 级联操作符写法（合法）

final controller = WebViewController()
  ..setJavaScriptMode(JavaScriptMode.unrestricted);

WebViewController()..setJavaScriptMode(...)是一个完整的表达式：它先创建WebViewController实例，接着调用实例的setJavaScriptMode方法，最后返回这个实例。整个表达式可以直接赋值给final变量，完全符合类成员初始化的语法要求。

2. 拆分写法（非法）

final controller = WebViewController();
controller.setJavaScriptMode(JavaScriptMode.unrestricted);

第一行是合法的变量初始化，但第二行controller.setJavaScriptMode(...)是一个独立的执行语句，放在类的成员声明区域会触发语法错误——Dart编译器会认为这里应该是成员声明（比如变量、方法），而非可执行代码。

替代解决方案 #

如果不想使用级联操作符，有两种合法的替代写法：

• 将方法调用放入构造函数体内

class HomeScreen extends StatelessWidget {
  HomeScreen({super.key}) {
    controller.setJavaScriptMode(JavaScriptMode.unrestricted);
  }

  final controller = WebViewController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: WebViewWidget(controller: controller),
    );
  }
}

• 使用late关键字延迟初始化变量

class HomeScreen extends StatelessWidget {
  HomeScreen({super.key}) {
    controller = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted);
  }

  late final WebViewController controller;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: WebViewWidget(controller: controller),
    );
  }
}

内容的提问来源于stack exchange，提问作者Daniel HyunHo Shin