搜索词未从 TextField 更新到 Firestore StreamBuilder 调用

Question

我正在尝试实现一个地方，让我的应用中的用户可以搜索我的 Firestore 数据库。

当用户在文本字段中输入搜索词时：

return Scaffold(
      appBar: AppBar(
        title: TextField(
          textInputAction: TextInputAction.search,
          onSubmitted: (value) {
            setState(() {
              searchKey = value;
              streamQuery = db
                  .collection('GearLockerItems')
                  .where('searchTerm', isGreaterThanOrEqualTo: searchKey)
                  .where('searchTerm', isLessThan: '${searchKey}z')
                  .snapshots();
            });
          },
          decoration: const InputDecoration(
            hintText: 'Search for Gear',
            prefixIcon: Icon(Icons.search),
          ),
        ),
      )

我取搜索词的值并将其放入streamQuery

然后我将那个 streamQuery 放入 StreamBuilder 中：

body: StreamBuilder<dynamic>(
        stream: streamQuery,
        builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
          //widget build for complated call
          print('Inside stream $searchKey');

          if (snapshot.hasData) {
            return ListView.builder(

如您所见，我在其中放置了一个打印语句进行测试，并且在 Stream $searchKey内部一直显示 null，这是我的默认设置。 我不明白为什么当我在搜索框中输入数据时，它没有将searchKey更新为我输入的内容，而是将其保留为 null ...

Answer 1

首先从 firestore 获取数据并使用 function 设置 state。它可以工作并且不要忘记使用 await 因为你等到数据被获取。

Answer 2

return Scaffold(
  appBar: AppBar(
    title: TextField(
      textInputAction: TextInputAction.search,
      onSubmitted: (value) {
          searchKey = value;
          await db
              .collection('GearLockerItems')
              .where('searchTerm', isGreaterThanOrEqualTo: searchKey)
              .where('searchTerm', isLessThan: '${searchKey}z')
              .snapshots().then((data) { setstate((){streamQuery = data; });});
      },
      decoration: const InputDecoration(
        hintText: 'Search for Gear',
        prefixIcon: Icon(Icons.search),
      ),
    ),
  )