Question

React很新，所以问题可能很简单，但出现以下错误：

意外的令牌，预期为“;”错误。

错误发生在render（）函数所在的位置。我该如何解决？

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

type Props = {};
export default class App extends Component{Props} {
  render() {
    return (
      <View style={styles.container}>
        <Text>style={styles.welcome}>Login To</Text>
        <Text>style={styles.design}>North Mall</Text>
        <TextInput
          style={styles.input}
          placeholder="Username"
          />
        <TextInput
          style={styles.input}
          placeholder="Password"
          secureTextEntry
        />
        <View style={styles.btnContainer}>
          <TouchableOpacity
            style={styles.userBtn}
            onPress={() => alert("Login Works")}
          >

            <Text style={styles.btnTxt}>Login</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.userBtn}
            onPress={() => alert("Signup Works")}
          >
            <Text style={styles.btnTxt}>Signup</Text>
          </TouchableOpacity>
        </View>
        </View>
      );
    }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '#0057ff'
  },
  welcome:{
    fontSize: 30,
    textAlign: 'center',
    margin: 10,
    color: "#fff",
    fontFamily:"DancingScript-Bold"
  }
}}

代码继续，但是我很确定错误在代码的第一部分。

Answer 1

如果要实现道具接口，请将Component{Props}更改为Component<Props>。

type Props = {}也不是您想要的。您需要为道具使用interface，例如：

interface Props {
  someProp: string;
  someOtherProp: number;
  // etc
}

如何修复意外的令牌，预期为“;” React中的错误

1 个答案: