React Native Firebase搜索列表视图

时间:2016-10-12 06:13:33

标签: javascript listview firebase react-native firebase-realtime-database

我的React Native应用程序中有一个从我的Firebase中补充的列表视图。我找到了一些关于人们如何使用fetch函数搜索listview的教程,但没有为Firebase提供任何内容。

我的列表视图标题中有一个搜索栏,如何使用关键字进行搜索并使用Firebase过滤结果?

我按照Firebase网站上的指南设置了我的listview和数据源。我希望能够在每个字段中按关键字搜索

def Valid_mixed_password(password):
    lower = re.compile(r'.*[a-z]+') # Compile to match lowercase
    upper = re.compile(r'.*[A-Z]+') # Compile to match uppercase
    if lower.match(password) and upper.match(password): # if the password contains both (lowercase and uppercase letters) then return True
        return True
    else: # Else, the password does not contains uppercase and lowercase letters then return False
        return False

>>> print Valid_mixed_password("hello")
False
>>> print Valid_mixed_password("HELLO")
False
>>> print Valid_mixed_password("HellO")
True
>>> print Valid_mixed_password("heLLo")
True

1 个答案:

答案 0 :(得分:3)

我终于弄明白了。此代码基于特定项目名称进行搜索。

数据库

 {
  "directory" : {
    "macintosh" : {
      "address" : "117 East 11th Street, Hays, KS 67601",
      "firstLetter" : "m",
      "title" : "Macintosh",
    },
   "apple" : {
      "address" : "117 East 11th Street, Hays, KS 67601",
      "firstLetter" : "a",
      "title" : "apple",
    },
  },

ListView w / Search Bar

  render() {
    return (
      <View style={styles.container}>
      <ScrollView>
      <SearchBar
          returnKeyType='search'
          lightTheme
          placeholder='Search...'
          onChangeText={(text) => this.setState({searchText:text})}
          onSubmitEditing={() => this.firstSearch()}
      />
        {
          this.state.loading &&

          <ActivityIndicator
            size="large"
            color="#3498db"
            style={styles.activityStyle}
          />

        }
        <ListView
            dataSource={this.state.dataSource}
            renderRow={this._renderItem.bind(this)}
            enableEmptySections={true}
        />
        </ScrollView>
      </View>
    );
  }

搜索功能

  firstSearch() {
    this.searchDirectory(this.itemsRef);
  }



searchDirectory(itemsRef) {

var searchText = this.state.searchText.toString();

if (searchText == ""){
  this.listenForItems(itemsRef);
}else{
  itemsRef.orderByChild("searchable").startAt(searchText).endAt(searchText).on('value', (snap) => {

    items = [];
    snap.forEach((child) => {
      items.push({
        address: child.val().address,
        firstLetter: child.val().firstLetter,
        title: child.val().title,
      });
    });


    this.setState({
      dataSource: this.state.dataSource.cloneWithRows(items)
    });

  });
}

}

这将通过使用orderbychild.startat()。endat()firebase函数替换listview数据源来搜索firebase。它与“SELECT * BY%LIKE%”sql搜索函数最接近。

我修改了我的代码以便按照第一个字母进行搜索。因此,如果有人搜索“Macbuk”,它仍会显示“Macbook”结果。它只搜索M.我将数据库中的另一个字段添加到要搜索的标题的第一个字母,并将其设为小写。