為什么 Provider 沒有給出初始化值而不是預期值？

Question

我正在嘗試顯示來自firestore的文檔字段值，並希望使用提供程序將其顯示在其他頁面上。

這是我在提供程序文件中的代碼：

class UserState extends ChangeNotifier {
  
  String userName = 'default error';

   Future<void> getName() async {
    await FirebaseFirestore.instance
        .collection("Users")
        .doc(FirebaseAuth.instance.currentUser!.uid)
        .get()
        .then((value) {
      userName = (value.data()?[' uname'] ?? "Default userName");
      print(userName);
    });
    notifyListeners();
  }
}

這里使用 print 語句打印了正確的userName值，但是當我嘗試通過提供程序傳遞它時，它顯示了我為 null 安全提供的初始化字符串值default error 。 這是我要顯示變量 userName 的屏幕：

class testscreen extends StatefulWidget {
  const testscreen({Key? key}) : super(key: key);
  _testscreenState createState() => _testscreenState();
}

class _testscreenState extends State<testscreen> {
  @override
  Widget build(BuildContext context) {

    Provider.of<UserState>(context, listen: false).getName();
    final String name = Provider.of<UserState>(context).userName;
    return Scaffold(body: Text(name));
  }
}

我怎樣才能顯示正確的值而不是 userName 的初始化值？我的代碼有什么問題？

Answer 1

notifyListeners不會等待完成提取。 你可以試試

  void getName() {
    FirebaseFirestore.instance
        .collection("Users")
        .doc(FirebaseAuth.instance.currentUser!.uid)
        .get()
        .then((value) {
      userName = (value.data()?[' uname'] ?? "Default userName");
      print(userName);
      notifyListeners();
    });
  }

要么

  Future<void> getName() async {
    final value = await FirebaseFirestore.instance
        .collection("Users")
        .doc(FirebaseAuth.instance.currentUser!.uid)
        .get();
    userName = (value.data()?[' uname'] ?? "Default userName");
    notifyListeners();
  }

對於這種情況，我更喜歡使用Consumer小部件。

Answer 2

代碼中有一些修復。

1. notifyListeners()不等待fetch完成

 await FirebaseFirestore.instance
        .collection("Users")
        .doc(FirebaseAuth.instance.currentUser!.uid)
        .get()
        .then((value) {
      userName = (value.data()?[' uname'] ?? "Default userName");
      print(userName);
      notifyListeners(); 👈 Try adding the notifyListeners() here
    });
  }

2. 從 bluid 方法中刪除provider()調用

class testscreen extends StatefulWidget {
  const testscreen({Key? key}) : super(key: key);
  _testscreenState createState() => _testscreenState();
}

class _testscreenState extends State<testscreen> {
  @override
  void initState() {
    super.initState();
     Provider.of<UserState>(context, listen: false).getName();👈 Call getName here
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(body: Text( Provider.of<UserState>(context).userName)); 👈 Call it this way
  }
}