特定のフィールドで検索する流星リアクションネイティブ

Question

2つのフィールドのみを使用して検索コンポーネントをフィルタリングしようとしています。今は、リスト内のすべてのフィールドから結果を返します。

{ 
    "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> 

私の検索が2であれば、それは何とか2

JSONファイルは、次のようになります含むすべての単一のオブジェクトを返します意味

このコンポーネントはどのように2つのフィールドのみで検索できますか？ {num_circo}と{nom}？

Answer 1

<SearchBar />は、すべてのdeputeオブジェクトから'id', 'id_an', 'lieu_naissance'フィールドを削除することができます。

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} 
     />