[英]How to pass data to the Typeahead from firestore in flutter
I'm a beginner in a flutter, in the flutter project I used flutter_typeahead package but I was not able to execute this code.我是 flutter 的初学者,在 flutter 项目中我使用了 flutter_typeahead package 但我无法执行此代码。 I want to search my items on the base of the input given by the user.
我想根据用户提供的输入搜索我的项目。 I write the following code with the Typoahead Anyone who tells me what is wrong in my code
我用 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;
});
}
}
My SearchService classcode is this我的 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我的 Firestore 数据是
when I start searching当我开始寻找
You are calling _getsearch()
but that doesn't return anything.您正在调用
_getsearch()
但这不会返回任何内容。 I think you just need to call getSuggestion(pattern)
on the SearchService
you've instantiated:我认为您只需要在您实例化的
SearchService
上调用getSuggestion(pattern)
:
suggestionsCallback: (pattern) async {
return await _searchService.getSuggestion(pattern);
},
It's quite possible that you'll need some mapping in either that getSuggestion()
function, or in the itemBuilder
to go from a DocumentSnapshot
to an object where you can call ['A']
or ['B']
on.您很可能需要在
getSuggestion()
function 或 itemBuilder 中从DocumentSnapshot
到itemBuilder
到 ZA8CFDE6331BD59EB2AC96F8911C1A89A6BZ 到 ZA8CFDE6331BD59EB2AC96F8911C17A89A6BZ 中的一些映射,或者在哪里调用['A']
B'B66 ['B']
。
I get the following solution in my case在我的情况下,我得到以下解决方案
My SearchServices class is我的 SearchServices class 是
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;
});
}
and my Typohead class is而我的 Typohead class 是
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);
},
),
),
);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.