在本机反应中使用firebase进行搜索答案

【问题标题】：Make Search using firebase in react native在本机反应中使用firebase进行搜索
【发布时间】：2019-12-27 18:40:39
【问题描述】：

我是反应原生和 firebase 的新手。我想制作一个搜索栏，可以根据 Barcode 值搜索 firebase 中的所有数据，但是在执行此操作时遇到了一些错误。我认为我的代码在某个地方是错误的，但不知道在哪里。我已将 firebase 凭据转移到 dbConfig.js 。这是我的 Firebase 数据 firebase data 和我的代码：

import React,{Component} from 'react';
import { View, Text,TextInput,StyleSheet,Image, Button} from 'react-native';

import firebase from './dbConfig';

export default class ListItem extends Component {

render() {
        return (
<>

<View style={styles.BackGround}>
      <View style={styles.SectionStyle}>
    <Image
        source={require('./mic.png')} //mic image here
        style={styles.ImageStyle}
    />


    <TextInput
        style={{ flex: 1, justifyContent: 'center', textAlign: 'center', fontSize: 12}}
        placeholder="Search for Product"
        underlineColorAndroid="transparent"
        //onChangeText={(text) => this.setState({data: text})}
        onSubmitEditing = {(text)=> this.setState({data: text})}
        value = {this.state.data}
       // onSubmitEditing={()=>this._search}
        //onSubmitEditing={()=>this.componentWillMount}
    />
    <Image
        source={require('./usr.png')} //icon image here
        style={styles.ImageStyle2}
    />
</View>


             <View>
             <Text>{this.state.items}</Text> 
            </View>
</View>
            </>
        );
    }


    constructor(props){
      super(props);

     this.state= {
          items: '',
          data: '',

       };
      }
    componentWillMount(){


      var ref = firebase.database().ref('/');

      ref.child(this.state.data).on("value", snapshot =>{

      console.log(snapshot.val().info.Price);
//if(snapshot.val().Price == this.state.data){
//this.setState({items: Object.values(snapshot.val())});
//}
//else{
 //alert('there is problem');
//}
      });
    }

}


const styles = StyleSheet.create({



  BackGround: {
    backgroundColor: '#22abb6',
    height: '100%'



   },

   SectionStyle: {
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#fff',
    // borderWidth: 0.8,
    // borderColor: '#000',
    shadowColor:'#176f75',

    marginTop: 50,
    height: 40,
    borderRadius: 10,
    margin: 10,
  },


  ImageStyle: {
    padding: 10,
    marginLeft: 10,
    margin: 5,
    height: 25,
    width: 25,
    resizeMode: 'stretch',
    alignItems: 'center',
  },
  ImageStyle2: {
    padding: 10,
    marginLeft: 10,
    marginRight: 10,
    margin: 5,
    height: 25,
    width: 25,
    resizeMode: 'stretch',
    alignItems: 'center',
  },


});

【问题讨论】：

我已经使用 dbConfig.js 文件导入了 firebase 凭据
我很容易获得数据，但无法根据我的要求将关键字/条形码推送到 Firebase。例如，10001 是洗衣机的条形码，当我手动搜索（分配数据 = 10001）时，我得到“洗衣机”作为输出。但在我的搜索中不起作用。
你试过去掉 de "14" 之前的第一个斜线吗：Like => var ref = firebase.database().ref('14/info');
它在我手动分配时工作[数据= 10001]；它以“洗衣机”的形式输出。但不能用作搜索
我尝试在“14”之前删除斜杠，但仍然无法正常工作

标签： javascript firebase react-native firebase-realtime-database react-native-android

【解决方案1】：

我通过更改以下内容来做到这一点：

 //adding this in TextInput

onSubmitEditing = {this.componentWillMount}



//on changing the function compoundWillMount to async()

 componentWillMount= async()=>{

【讨论】：