【问题标题】:How to pass data to the Typeahead from firestore in flutter如何在flutter中将数据从firestore传递给Typeahead
【发布时间】:2020-08-16 15:44:34
【问题描述】:

我是flutter的初学者,在flutter项目中我使用了flutter_typeahead包,但我无法执行这段代码。 我想根据用户提供的输入搜索我的项目。我用 Typoahead 编写了以下代码 任何人告诉我我的代码有什么问题

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:flutter_typeahead/flutter_typeahead.dart';
import 'package:fmiantrader/SearchService.dart';
import 'SearchService.dart';

class Serchitemsbymod extends StatefulWidget {
  static String id='serchitemsbymod';
  @override
  _SerchitemsbymodState createState() => _SerchitemsbymodState();
}

class _SerchitemsbymodState extends State<Serchitemsbymod> {



  List<String> store=[];
  var q=[];
  var t=[];


  SearchService _searchService=SearchService();
  List<DocumentSnapshot>  search=<DocumentSnapshot>[];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Mian Traders'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(30.0),
        child: TypeAheadField(
          textFieldConfiguration: TextFieldConfiguration(
              autofocus: true,
              style: DefaultTextStyle.of(context).style.copyWith(
                  fontStyle: FontStyle.italic
              ),
              decoration: InputDecoration(
                  border: OutlineInputBorder()
              )
          ),
          suggestionsCallback: (pattern) async {
            return await _getsearch().getSuggestion(pattern);
          },
          itemBuilder: (context, suggestion) {
            return ListTile(
              leading: Icon(Icons.shopping_cart),
              title: Column(
                children: <Widget>[
                  Text(suggestion['A']),
                  Text(suggestion['B']),
                ],
              ),
              subtitle: Text('${suggestion['C']}'),

            );
          },
          onSuggestionSelected: (suggestion) {
//                Navigator.of(context).push(MaterialPageRoute(
//                    builder: (context) => ProductPage(product: suggestion)
//                ));
          },
        ),
      ),
    );

  }
  _getsearch()async{
    List<DocumentSnapshot> data=await _searchService.getSearch();
    setState(() {
      search=data;
    });
  }
}

我的 SearchService 类代码是这样的

import 'package:cloud_firestore/cloud_firestore.dart';

class SearchService {
  Firestore _firestore = Firestore.instance;
  String ref='items';
  Future<List<DocumentSnapshot>> getSearch() =>
    _firestore.collection(ref)
    .getDocuments()
    .then((snaps){
      return snaps.documents;
  });

  Future<List<DocumentSnapshot>> getSuggestion(String suggestion) =>
    _firestore.collection(ref)
    .where('items', isEqualTo: suggestion)
    .getDocuments()
    .then((snap) {
      return snap.documents;
  });
}

My firestore data is

当我开始搜索时

I got the following error

【问题讨论】:

    标签: firebase flutter flutter-dependencies flutter-animation


    【解决方案1】:

    您正在调用_getsearch(),但这不会返回任何内容。 我认为您只需要在您已实例化的SearchService 上调用getSuggestion(pattern)

    suggestionsCallback: (pattern) async {
      return await _searchService.getSuggestion(pattern);
    },
    

    很有可能您需要在getSuggestion() 函数或itemBuilder 中进行一些映射,以便从DocumentSnapshot 转到可以调用['A']['B'] 的对象。

    【讨论】:

    • 请解释我必须在哪里添加映射以及如何使用请解释我是新手
    • 请回复我。
    【解决方案2】:

    在我的情况下,我得到了以下解决方案

    我的 SearchServices 类是

    import 'package:cloud_firestore/cloud_firestore.dart';
    
    class SearchService {
      Firestore _firestore = Firestore.instance;
      String ref = 'items';
      Future<List<DocumentSnapshot>> getSearch() async =>
          await _firestore.collection(ref).getDocuments().then((snaps) {
            return snaps.documents;
          });
      Future<List<DocumentSnapshot>> getuserSearch() async =>
          await _firestore.collection('users').getDocuments().then((snaps) {
            return snaps.documents;
          });
    
      Future<List<DocumentSnapshot>> getSuggestion(String suggestion) async =>
          await _firestore
              .collection(ref)
              .where('items', isEqualTo: suggestion)
              .getDocuments()
              .then((snap) {
            return snap.documents;
          });
    }
    

    我的 Typohead 类是

    import 'dart:convert';
    import 'package:flutter/material.dart';
    import 'package:flutter_typeahead/flutter_typeahead.dart';
    import 'package:fmiantrader/SearchService.dart';
    import 'SearchService.dart';
    
    class Serchitemsbymod extends StatefulWidget {
      static String id = 'serchitemsbymod';
      @override
      _SerchitemsbymodState createState() => _SerchitemsbymodState();
    }
    
    class _SerchitemsbymodState extends State<Serchitemsbymod> {
      SearchService _searchService = SearchService();
      List<Map> search = <Map>[];
    
      @override
      void initState() {
        getDocs();
        super.initState();
      }
    
      Future getDocs() async {
        search =
            (await _searchService.getSearch()).map((item) => item.data).toList();
        setState(() {});
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('Mian Traders'),
          ),
          body: Padding(
            padding: const EdgeInsets.all(30.0),
            child:TypeAheadField(
              textFieldConfiguration: TextFieldConfiguration(
                  autofocus: false,
                  textAlign: TextAlign.center,
                  style:
                  TextStyle(
                      color: Colors.black,
                      fontSize: 15.0
                  ),
                  decoration: InputDecoration(border: OutlineInputBorder(
                    borderSide: BorderSide(color:Colors.blueAccent,width: 1.0),
                    borderRadius: BorderRadius.circular(32.0),
                  ),
                    enabledBorder: OutlineInputBorder(
                        borderSide: BorderSide(color: Colors.blueAccent),
                        borderRadius: BorderRadius.circular(32.0)
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide(color: Colors.blueAccent,width: 2.0),
                      borderRadius: BorderRadius.circular(32.0),
                    ),
                    hintText: ('Enter the Name of item'),
                    hintStyle: TextStyle(
                      fontSize: 15.0,
                    ),
                  )),
              suggestionsCallback: (pattern) {
                return search.where(
                      (doc) => jsonEncode(doc)
                      .toLowerCase()
                      .contains(pattern.toLowerCase()),
                );
              },
              itemBuilder: (context, suggestion) {
                return Card(
                  color: Colors.lightBlueAccent,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(12.0),
                  ),
                  elevation: 6.0,
                  child: Center(
                    child: Column(
                      children: <Widget>[
                        Text(suggestion['A'],
                          textAlign: TextAlign.center,
                          style: TextStyle(
                            color: Colors.black,
                            fontSize: 15.0,
                          ),),
                        Text(suggestion['B'],
                            textAlign: TextAlign.center,
                            style: TextStyle(
                              color: Colors.black,
                              fontSize: 15.0,
                            )),
                        Text(suggestion['C'],
                          textAlign: TextAlign.center,
                          style: TextStyle(
                            color: Colors.black,
                            fontSize: 15.0,
                          ),)
                      ],
                    ),
    
                  ),
                );
              },
              onSuggestionSelected: (suggestion) {
                final map = jsonDecode(suggestion);
              },
            ),
          ),
        );
      }
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-01-21
      • 2018-08-19
      • 2021-06-15
      • 2020-02-02
      • 2021-11-15
      • 1970-01-01
      • 2019-08-19
      • 2021-02-08
      相关资源
      最近更新 更多