Как получить идентификатор объекта onPress и передать это значение на новый экран в React Native? - PullRequest
Новая
       13

Как получить идентификатор объекта onPress и передать это значение на новый экран в React Native?

0 голосов
/ 18 января 2019

Я создал приложение React Native, которое показывает список различных objects на ListScreen. Теперь я хочу с onPress показать одно object значение на ViewScreen

Я создал свое приложение, используя React-Redux и React-navigation, сейчас я не уверен, стоит ли мне хранить данные объекта в store, но я не уверен, что это правильный путь используйте хранилище Redux (потому что в настоящее время я использую его для элементов корзины) или если есть другой способ передать эти значения на ViewScreen.

Это упрощение моего приложения:

Я сделал статический Data.js файл для тестирования приложения

Data.JS 

`id: 0, 
 name: 'John Doe', 
 age: '15',
 gender: 'male',
`

Затем я импортирую данные в ListScreen

List.js 

`import { object} from './Data';
 state = {
    object, 
  };
renderRow = (rowData) => { 
    return (
        <View>
            <TouchableOpacity onPress={() => this.props.id.navigation.navigate('ViewScreen')}> 
                <View>
                <Text>
                {rowData.item.name}
                </Text>
            </View>
        </TouchableOpacity>
        </View>
    )
  }
  render() {
    return (    
        <View>
             <FlatList
             renderItem={this.renderRow}
             keyExtractor={(item, index) => index.toString()}
         />
        </View>
    )
  }
`

Viewscreen 

` state = {
    object, 
  };
renderRow = (rowData) => { 
    return (
        <View>
            <TouchableOpacity onPress={() => this.props.id.navigation.navigate('ViewScreen')}> 
                <View>
                <Text>
                {rowData.item.name}
                                {rowData.item.age}
                                {rowData.item.gender}
                </Text>
            </View>
        </TouchableOpacity>
        </View>
    )
  }
  render() {
    return (    
        <View>
             <FlatList
             renderItem={this.renderRow}
             keyExtractor={(item, index) => index.toString()}
         />
        </View>
    )
  }
`

Как мне забрать это отсюда? Так что значение будет показано в ViewScreen

1 Ответ

0 голосов
/ 18 января 2019

Вы почти там, просто добавьте этот второй аргумент в метод печати, и все готово.

Вы получите эти данные в подпорке данных следующего экрана. 

renderRow = (rowData) => { 
    return (
        <View>
            <TouchableOpacity onPress={() => 
            this.props.id.navigation.navigate('ViewScreen',{data : rowData})}> 
                <View>
                <Text>
                  {rowData.item.name}
                  {rowData.item.age}
                  {rowData.item.gender}
                </Text>
            </View>
        </TouchableOpacity>
        </View>
    )
  }
...