在Press上响应本机更改视图 [英] React Native change view onPress

问题描述

我在Google上进行了搜索，但我不知道该怎么做.

I have searched on google but I don't know react.

当我单击"Connexion"按钮时，我想转发到About.js页面.

When I click on the button 'Connexion' I would like to be forwarded to the page About.js.

我的app.js:

import React from 'react';
import {View, TextInput, StyleSheet, Text } from 'react-native';
import { Header, Button } from 'react-native-elements';
import About from './component/About';
export default class App extends React.Component {

  render() {
    return (
        <View style={{flex: 1}}>
           
            <Button
                title="CONNEXION"
                buttonStyle={{backgroundColor: "#F1C40F", borderColor: "transparent", marginTop: 20,}}
            />
            
        </View>
    );
  }

}

   

我的About.js

My About.js

import React from 'react';
import {Text, View, StyleSheet } from 'react-native';
export default class About extends React.Component{
    render() {
        return (

            <View style={style.view}>
                <Text style={style.title}> A propos de moi</Text>
                
            </View>
        );
    }
}


});

推荐答案

1. 安装react-navigation

纱线添加反应导航

或使用npm

yarn add react-navigation

or with npm

1. 在您的index.js中，导入StackNavigator

1. Inside your index.js, import StackNavigator

import App from './components/app; import About1 from './components/About; import {StackNavigator} from 'react-navigation';

import App from './components/app; import About1 from './components/About; import {StackNavigator} from 'react-navigation';

然后将以下代码添加到index.js的最后

Then add below code to the last of index.js

export default StackNavigator({ Home: {

screen: App,

},

Aboutsss:{ screen: About1, },

});

1. 在app.js内部，按钮内部给出，

1. Inside app.js, inside button give,

onPress = {this.props.navigation.navigate('Aboutsss')}

希望您能理解，如有疑问，请随时发表评论. 注意:-当我尝试使用npm进行安装时，在Windows中出现了一些错误，但是yarn没问题.

Hope you understand and if any doubt feel free to comment. note:- when I try to install using npm I got some error in windows, but no problem with yarn.

这篇关于在Press上响应本机更改视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！