У меня есть приложение в response-native, где у меня есть список пользователей, и я хочу их фильтровать, когда я нажимаю кнопку в заголовке, используя их фактическое положение. Как я могу это сделать ?

Заранее спасибо!

Редактировать:

export default data = [
   {
      id:1,
      name:"Anastasia",
      photo_path: "https://www.one-voyance.fr/media/cache/slider/images/voyants/anastasia/anastasia.jpg",
      age: "23",
      pratique: "Trans.",
      distance: "200m",
      connected: 1,
      description:"Anastasia, medium pure sans support.Mon don héréditaire me vient de mes grands parents. Prête à vous servir, je m’appuie de mes guides pour vous guider dans votre chemin de vie.Je suis compétente dans tous les domaines. La vie est faite de détours, en connaitre les recoins permet d’avancer sereinement sans se poser de questions. Je vous attends pour une voyance claire et de qualité.",
      //numero:"06 01 02 03 04"
   }
0
SauceCurry 29 Окт 2019 в 12:14
Можете ли вы показать примерный список пользователей, подлежащих фильтрации, и ваш код?
 – 
Vignesh V Pai
29 Окт 2019 в 12:15
Пока я просто получаю данные из массива, но планирую получить их из json. Только что отредактировал
 – 
SauceCurry
29 Окт 2019 в 12:19
Что вы имеете в виду под должностью? Вы про позицию в массиве?
 – 
Leomar Amiel
29 Окт 2019 в 12:23
Нет, я имею в виду геолокацию пользователя
 – 
SauceCurry
29 Окт 2019 в 12:27

3 ответа

Вы можете использовать метод фильтрации, предоставляемый массивом, для фильтрации данных. Решение будет примерно таким:

let tempResults = data.filter(element => element.position === 'Some position')

Для кнопки вам нужно будет добавить обработчик события onPress, как показано ниже:

<Button onPress={this.handleButtonPress} />

И определите функцию-обработчик как-то вроде:

handleButtonPress = () => {
 let tempResults = this.state.data.filter(element => element.position === 'Some position')
 this.setState({dataToBeRendered: tempResults})
}

Надеюсь, это даст вам представление.

1
Vignesh V Pai 29 Окт 2019 в 12:29
Спасибо за помощь, ценим!
 – 
SauceCurry
29 Окт 2019 в 12:33

Ознакомьтесь с документацией, чтобы получить Геолокацию с помощью React Native. Затем вы можете делать с вашими данными все, что захотите, в зависимости от геолокации пользователя.

1
Leomar Amiel 29 Окт 2019 в 16:46

Вам следует setParams и передать function и filter value в header и выполнить операцию с function, полученным в params, как показано ниже

this.state = {
 position: "",
 result: []
} 

static navigationOptions = ({ navigation }) => {
    const params = navigation.state.params || {};
return {
headerTitle: {params.position}
headerLeft: <View/>
headerRight: <View><Button onPress={params.handleFilter("200")}>Filter</Button> </View>
}}


componentWillMount() {
    this.props.navigation.setParams(
      Object.assign({}, this.props.navigation.state.params, {
        handleFilter: this.handleFilter,
        position: this.state.position
      })
    );
  }

handleFilter = position => {
  this.setState({ position: position })
  result.filter(data => Number(data.position) < Number(position)) 

}
0
Kamal Pandey 29 Окт 2019 в 12:37