按特定字段搜索Meteor React Native

Question

我尝试仅使用两个字段过滤搜索组件。现在，它返回列表中所有字段的结果。意思是如果我的搜索是2，它将返回包含某种方式的每个单个对象2。

json文件如下所示：

{
  "deputes" : [ {
    "depute" : {
      "id" : 1,
      "id_an" : "718902",
      "lieu_naissance" : "Brest (Finistère)",
      "nom_circo" : "Alpes-Maritimes",
      "nom_de_famille" : "Roussel",
      "num_circo" : 3

还有一个搜索组件，如下所示：

class Flat_List extends Component{

  constructor(props){
    super(props);
    console.log(props)
    this._handleResults = this._handleResults.bind(this);
    this.state = {
      data : null
    }
  }

  _handleResults(results){
    console.log('handle results')
    this.setState({data: results})
  }

   render() {
    let listitems = this.state.data
    if (this.state.data == null)  {
      listitems = this.props.deputies
    }
    return(
    <View>

      <SearchBar
        ref={(ref) => this.searchBar = ref}
        data={this.props.deputies}
        handleResults={this._handleResults}
        allDataOnEmptySearch = {true}
        showOnLoad = {true}
        hideBack
        autoCorrect= {false}
      />

      <List>
        <FlatList style={styles.flatListStyle}
          data={listitems}
          keyExtractor={(item)=> item._id}
          renderItem={({item})=>(
             <DeputyDetail deputy={item.depute} navigation={this.props.navigation} /> )} />
      </List>

    </View>

该组件如何仅搜索两个字段？ {num_circo}和{nom}？

Answer 1

您可以从每个'id', 'id_an', 'lieu_naissance'对象中删除depute字段，以便<SearchBar />不会搜索这些字段。

您可以添加以下代码以删除这些字段：

componentWillMount(){
    var removeObjProps = ['id', 'id_an', 'lieu_naissance'];
    var filteredDep = Object.assign({}, this.props.deputies);
    filteredDep.deputies.forEach(function(dep){
        removeObjProps.forEach(function (val) {
            delete dep.depute[val];
        });
    });
    this.setState({filteredDep})
}

并用以下内容替换搜索栏：

   <SearchBar
        ref={(ref) => this.searchBar = ref}
        data={this.state.filteredDep}
        handleResults={this._handleResults}
        allDataOnEmptySearch = {true}
        showOnLoad = {true}
        hideBack
        autoCorrect= {false}
      />