React Native Click事件在导航屏幕上不起作用

时间:2018-09-22 05:43:42

标签: react-native react-navigation react-native-router-flux

我正在做一个本机反应项目,其中在导航屏幕上没有触发我的按钮。我尝试使用react-navigationreact-native-router-flux,但仍然无法正常工作。代码是这样的

App.js

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';
import MapView from 'react-native-maps';
import { StackNavigator } from 'react-navigation';
import {Scene, Router} from 'react-native-router-flux';

import Home from './Home';

const AppNavigator = StackNavigator({
  HomeScreen: { screen: Home }
});



type Props = {};
export default class App extends Component<Props> {
  render() {
    return (
      <View >
       <Router showNavigationBar={false} style={{ backgroundColor : '#FFF' }}>
            <Scene key="root">
                <Scene key="home" component={Home}  initial/>
            </Scene>
        </Router>

     </View>
    );
  }
}

Home.js

import React from 'react';
import { StyleSheet, View, Text, StatusBar, Button, Alert, Image, Dimensions, TouchableHighlight } from 'react-native';
export default class Home extends React.Component  {
    render() {
        return (
            <View >
                <Button
                    onPress={() => {
                        Alert.alert('You tapped the button!');
                      }}
                      title="COBA"
                />
                <Button
                    onPress={() => {
                        Alert.alert('You tapped the button!');
                      }}
                      title="COBA"
                />
                <Button
                    onPress={() => {
                        Alert.alert('You tapped the button!');
                      }}
                      title="COBA"
                />
                <Button
                    onPress={() => {
                        Alert.alert('You tapped the button!');
                      }}
                      title="COBA"
                />


            </View>

        )
    }
}

当我单击“ COBA”按钮时,它不显示警报。但是,当我在App.js中渲染Home组件时,它的效果很好。

App.js(Click事件正在运行,但是我必须在此项目中使用导航)

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';
import MapView from 'react-native-maps';
import { StackNavigator } from 'react-navigation';
import {Scene, Router} from 'react-native-router-flux';

import Home from './Home';

type Props = {};
export default class App extends Component<Props> {
  render() {
    return (
      <View >
       <Home />
     </View>
    );
  }
}

有人可以帮我吗?

0 个答案:

没有答案