Question

我安装了反应原生的0.30，我在更新和执行我在互联网上找到的旧代码时遇到了麻烦。

这是旧的代码：

"use strict";

var React = require("react-native");

var {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    TextInput,
    AsyncStorage,
} = React;

var ReactProject = React.createClass({

    componentDidMount: function() {
        AsyncStorage.getItem("myKey").then((value) => {
            this.setState({"myKey": value});
        }).done();
    },

    getInitialState: function() {
        return { };
    },

    render: function() {
        return (
            <View style={styles.container}>
                <Text style={styles.saved}>
                    {this.state.myKey}
                </Text>
                <View>
                    <TextInput
                        style={styles.formInput}
                        onChangeText={(text) => this.saveData(text)}
                        value="" />
                </View>
                <Text style={styles.instructions}>
                    Type something into the text box.  It will be saved to
                    device storage.  Next time you open the application, the saved data
                    will still exist.
                </Text>
            </View>
        );
    },

    saveData: function(value) {
        AsyncStorage.setItem("myKey", value);
        this.setState({"myKey": value});
    }

});

var styles = StyleSheet.create({
    container: {
        padding: 30,
        flex: 1,
        justifyContent: "center",
        alignItems: "stretch",
        backgroundColor: "#F5FCFF",
    },
    formInput: {
        flex: 1,
        height: 26,
        fontSize: 13,
        borderWidth: 1,
        borderColor: "#555555",
    },
    saved: {
        fontSize: 20,
        textAlign: "center",
        margin: 10,
    },
    instructions: {
        textAlign: "center",
        color: "#333333",
        marginBottom: 5,
        marginTop: 5,
    },
});

AppRegistry.registerComponent('ReactProject', () => ReactProject);

以下是我为更新它所做的工作：

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */
"use strict";

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  TextInput,
  AsyncStorage,
  View
} from 'react-native';

class pulps extends Component {

  componentDidMount() {
      AsyncStorage.getItem("myKey").then((value) => {
          this.setState({"myKey": value});
      }).done();
  }

  getInitialState() {
    return { };
  }

  render() {
    return (
            <View style={styles.container}>
                <Text style={styles.saved}>
                    {this.state.myKey}
                </Text>
                <View>
                    <TextInput
                        style={styles.formInput}
                        onChangeText={(text) => this.saveData(text)}
                        value="" />
                </View>
                <Text style={styles.instructions}>
                    Type something into the text box.  It will be saved to
                    device storage.  Next time you open the application, the saved data
                    will still exist.
                </Text>
            </View>
    );
  }

  saveData(value) {
        return (
        AsyncStorage.setItem("myKey", value);
        this.setState({"myKey": value});
        );
    }
}

var styles = StyleSheet.create({
    container: {
        padding: 30,
        flex: 1,
        justifyContent: "center",
        alignItems: "stretch",
        backgroundColor: "#F5FCFF",
    },
    formInput: {
        flex: 1,
        height: 26,
        fontSize: 13,
        borderWidth: 1,
        borderColor: "#555555",
    },
    saved: {
        fontSize: 20,
        textAlign: "center",
        margin: 10,
    },
    instructions: {
        textAlign: "center",
        color: "#333333",
        marginBottom: 5,
        marginTop: 5,
    },
});

AppRegistry.registerComponent('pulps', () => pulps);

但是当我按下cmd + R时，我的ios-simulator屏幕上出现以下错误：

SyntaxError /Users/***/Documents/pulps/index.ios.js: Unexpected token(53:44)

你能告诉我我错在哪里吗？顺便说一句，这种脚本使用普通的Javascript或ES6会更好吗？谢谢！

Answer 1

当以不允许的方式使用“return”时，方法saveData中只有一个错误。

您的代码：

  saveData(value) {
        return (
        AsyncStorage.setItem("myKey", value);
        this.setState({"myKey": value});
        );
    }

调用两个void方法时，不能在此处使用“return”。只需改变它：

  saveData(value) {
      AsyncStorage.setItem("myKey", value);
      this.setState({"myKey": value});
  }

尝试将旧的反应原生文件更新为0.30

1 个答案: