Flutter setState()后页面不更新求助：关注/取消关注功能异常

嘿，我来帮你梳理下这个页面状态不更新的问题，主要有几个关键的错误和优化点：

1. 最核心的错误：赋值运算符用反了 #

你在setState里写的是相等比较运算符==，这根本没把布尔值赋值给friends变量！正确的写法应该是用赋值运算符=：

Future<Null> _friends() async { 
  fb.child("users/${userid}/Following/${id}").onValue.listen((Event event) { 
    setState((){ 
      // 把 == 改成 =，一行代码替代冗余的if-else
      friends = event.snapshot.value != null;
    }); 
  }); 
}

之前的代码只是在判断friends是否等于true/false，完全没修改变量值，所以setState触发后，页面自然不会有变化。

2. 按钮点击事件的写法错误 #

你现在的按钮代码：

friends == true ? new RaisedButton(onPressed: unfollow()) : new RaisedButton(onPressed: follow());

这里的onPressed: unfollow()会在页面初始化时直接调用unfollow函数，而不是点击按钮时才触发。正确的写法是传递函数引用，不要加括号：

friends 
  ? RaisedButton(onPressed: unfollow) 
  : RaisedButton(onPressed: follow);

如果需要给函数传参，可以用匿名函数包裹：

friends 
  ? RaisedButton(onPressed: () => unfollow(targetId)) 
  : RaisedButton(onPressed: () => follow(targetId));

3. Firebase监听的优化建议 #

场景1：只需要单次查询关注状态 #

如果不需要实时监听关注状态的变化（比如只有用户主动操作才会改变），可以用once()替代listen()，避免持续监听带来的资源消耗：

Future<void> _checkFollowStatus() async {
  final snapshot = await fb.child("users/${userid}/Following/${id}").once();
  setState(() {
    friends = snapshot.value != null;
  });
}

然后在initState生命周期里调用这个方法即可。

场景2：需要实时同步关注状态 #

如果要实时监听其他地方对关注状态的修改（比如多端同步），那保留listen()是对的，但要记得在组件销毁时取消订阅，防止内存泄漏：

StreamSubscription? _followSubscription;

@override
void initState() {
  super.initState();
  _followSubscription = fb.child("users/${userid}/Following/${id}").onValue.listen((event) {
    setState(() {
      friends = event.snapshot.value != null;
    });
  });
}

@override
void dispose() {
  // 组件销毁时取消订阅
  _followSubscription?.cancel();
  super.dispose();
}

4. 初始化变量默认值 #

你的公共变量bool friends;没有初始化，初始值是null，可能会导致页面初始化时的异常，建议给个默认值：

bool friends = false;

按照上面的步骤修改后，页面应该就能正常根据friends的状态更新按钮了～

内容的提问来源于stack exchange，提问作者Charles Jr