单击文本时尝试更改屏幕，但意外";"期望错误

Question

嘿，我一直在测试不同的方法，通过单击图像，试图导航到另一个页面，因此我一直在对模型(此代码(进行测试以便能够通过单击文本来导航到" AddDocscreen"，但它会给我一个错误。谁能帮忙

这是错误：

Failed to load bundle(http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false) with error:(SyntaxError: /Users/camillebasbous/Project/App.js: Unexpected token, expected ";" (30:27)
[0m [90m 28 | [39m[0m
[0m [90m 29 | [39m        [0m
[0m[31m[1m>[22m[39m[90m 30 | [39m       navigateToScreen () [33m=>[39m () [33m=>[39m {[0m
[0m [90m    | [39m                           [31m[1m^[22m[39m[0m
[0m [90m 31 | [39m [0m
[0m [90m 32 | [39m        [36mconst[39m navigationAction [33m=[39m [33mNavigationActions[39m[33m.[39mnavigate({[0m
[0m [90m 33 | [39m           routeName[33m:[39m [32m'AddDocSreen'[39m[33m,[39m[0m (null))
__38-[RCTCxxBridge loadSource:onProgress:]_block_invoke.228
    RCTCxxBridge.mm:414
___ZL36attemptAsynchronousLoadOfBundleAtURLP5NSURLU13block_pointerFvP18RCTLoadingProgressEU13block_pointerFvP7NSErrorP9RCTSourceE_block_invoke.118
__80-[RCTMultipartDataTask URLSession:streamTask:didBecomeInputStream:outputStream:]_block_invoke
-[RCTMultipartStreamReader emitChunk:headers:callback:done:]
-[RCTMultipartStreamReader readAllPartsWithCompletionCallback:progressCallback:]
-[RCTMultipartDataTask URLSession:streamTask:didBecomeInputStream:outputStream:]
__88-[NSURLSession delegate_streamTask:didBecomeInputStream:outputStream:completionHandler:]_block_invoke
__NSBLOCKOPERATION_IS_CALLING_OUT_TO_A_BLOCK__
-[NSBlockOperation main]
-[__NSOperationInternal _start:]
__NSOQSchedule_f
_dispatch_call_block_and_release
_dispatch_client_callout
_dispatch_continuation_pop
_dispatch_async_redirect_invoke
_dispatch_root_queue_drain
_dispatch_worker_thread2
_pthread_wqthread
start_wqthread

这是模型代码：

import React from 'react';
import {AppRegistry, StyleSheet, View, Image, TouchableOpacity, Text} from "react-native" ;
import { createAppContainer, createStackNavigator, StackActions, NavigationActions, navigateToScreen } from 'react-navigation'; // Version can be specified in package.json
import AddDocScreen from './Menu/AddDocScreen'


export default class Mock extends React.Component{
    render(){

        return(
            <View style={styles.container}>
           <TouchableOpacity
    onPress={ this.navigateToScreen('AddDocScreen') }>
        <View><Text>Click Me</Text></View>
</TouchableOpacity>

            </View>
        )
    }
}

       navigateToScreen () => () => {
        const navigationAction = NavigationActions.navigate({
           routeName: 'AddDocSreen',

})
        this.props.navigation.dispatch(navigationAction)
    }


const doc = createStackNavigator({
  AddDocScreen: {screen: AddDocScreen},
});
const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: 'rgba(215,215,215,1)',
        alignItems: 'center',
        justifyContent: 'center',
    },

Answer 1

看起来您错过了半隆：

import AddDocScreen from './Menu/AddDocScreen'

另外，请确保您也将半隆添加到return语句中。对于将来的参考，该错误本身告诉您语法错误的问题在哪里。

Unexpected token, expected ";" (30:27)

这意味着您错过了第30行，字符27。缺少半分号。

编辑：另外，再次查看您的代码，发现了另一个错误：

onPress={ this.navigateToScreen('AddDocScreen') }>

应该是

onPress={ () => this.navigateToScreen('AddDocScreen') }>

编辑编辑：(我真的很讨厌无法添加评论(您提到navigateToScreen () => () => {是错误。这就说得通了。我很抱歉缺少它！在React Native中，您希望方法签名看起来像

navigateToScreen() {
 ... code ...
}

您当前这样做的方式几乎是ES6(即function = () => {};(，但没有反应本机。您可以在此教程页面上看到一个示例。注意该方法看起来像

  _onPressButton() {
    Alert.alert('You tapped the button!')
  }