Как перейти к другому занятию при нажатии на элемент списка

Question

Как переходить с одной страницы на другую в реагировать на родной.Здесь я хочу перейти к своей деятельности к другой деятельности, когда я нажимаю на элемент списка, это переходит на другую страницу. Вы можете проверить мой код ниже

import React, {Component} from 'react';
import { StyleSheet, View,  AppRegistry,} from 'react-native';
import { List, ListItem, Icon, Text } from 'native-base';
import { StackNavigator } from 'react-navigation';
import Adjective        from './Topic/Adjective';

class BasicFlatList extends Component {

    onSourcesSetting = () => {
        this.props.navigation.navigate('Adj');
    }

     render(){

      return(
        <List>
            <ListItem 
            button
            noBorder
            onPress={() => this.onSourcesSetting}>
            <Text>Adjective</Text>
            </ListItem>

        </List>
        );
    }

}

const App = StackNavigator({
    Adj: Adjective, 


  });

export default BasicFlatList;

Answer 1

Вы можете создать новый экран (компонент) и передать имя этого маршрута и другие необходимые параметры в функцию.

import React, {Component} from 'react';
import { StyleSheet, View,  AppRegistry,} from 'react-native';
import { List, ListItem, Icon, Text } from 'native-base';
import { StackNavigator } from 'react-navigation';
import Adjective        from './Topic/Adjective';

  class BasicFlatList extends Component {

    onSourcesSetting = () => {
        this.props.navigation.navigate('AdjDetail', {
          // require params(maybe adj id)
        });
    }

     render(){

      return(
        <List>
            <ListItem 
            button
            noBorder
            onPress={() => this.onSourcesSetting}>
            <Text>Adjective</Text>
            </ListItem>

        </List>
        );
    }

}

class AdjectiveDetail extends React.Component {
 render() {
   console.log("props", this.props);
   return null;
 }
}

const App = StackNavigator({
    Adj: Adjective, 
    AdjDetail: AdjectionDetail

  });

export default BasicFlatList;

Из кода, который я предполагаю, вы используете реагирующую навигацию.Вы можете просмотреть документацию для получения более подробной информации.

PS: Reaction-native создает одно действие, а все приложение запускается внутри одного действия, нет такой вещи, как переход из одного действия.другому как в андроиде.