单击按钮后如何在清单中呈现项目?

时间:2019-07-28 11:20:34

标签: react-native react-native-flatlist

我正在尝试执行搜索功能。我要在单击按钮时将项目呈现在平面清单中。我该怎么办?

<View style={contentStyle}>
    <TitleBar
        leftIconName='ios-arrow-round-back'
        leftIconFunction={ () => navigation.goBack() }
        rightIconName ='ios-search'
        rightIconFunction = { () => this.onPressSearch()}
    />
    <TextInput
            placeholder='Search Coaches'
            selectionColor={config.COLOR_PRIMARY}
            underlineColorAndroid={config.COLOR_PRIMARY}
            placeholderTextColor={config.COLOR_TEXT_LIGHT}
            value={this.state.query}
            onChangeText={ text => this.setState({ query: text }) }
        />
    <FlatList
        data={ this.state.coaches }
        renderItem={ ({item}) => this.renderCoachListItem(item, user) }
        keyExtractor={ (item, index) => index }
    />
</View>

这是onPress搜索功能,单击搜索图标后,我便希望调用该功能以将其显示在平面列表中。

onPressSearch() {
  const {
    navigation
  } = this.props;
  const query = this.state.query;
  axios.get(config.HOSTNAME + '/counsellors/search?query=' + query, {
      headers: ({
        'Authorization': 'Bearer ' + token
      })
    })
    .then(resp => {
      const coaches = resp.data;
      this.setState({
        coaches: coaches
      });
    })
    .catch(err => Alert.alert(config.APP_NAME, JSON.stringify(err)));
}

0 个答案:

没有答案