Question

我是React Native的新手，仍然在学习。一切正常，但突然我在模拟器和代码编辑器中出现错误，花了两天时间试图找到解决方案，但未找到任何结果

我遇到两个错误 1）在代码编辑器中（无法访问的代码ts.7027 2）在模拟器中（开发服务器返回的响应错误代码：500）

我做了很多尝试来更改和修改代码，可能是语法错误甚至是拼写错误，但我无法这是针对新的本机项目创建登录页面表单的步骤

import React, { Component } from 'react';
import {View} from 'react-native';
import firebase from 'firebase';
import {Header, Button, Spinner} from './Components/Common';
import LoginForm from './Components/LoginForm';



class App extends Component {
  state = { loggedIn: null };

  componentWillMount () {
    firebase.initializeApp(
      {
    apiKey: "AIzaSyAX09VgJkSzx3d5z8UcyznmhTUNLUgYzMw",
    authDomain: "hatimauth.firebaseapp.com",
    databaseURL: "https://hatimauth.firebaseio.com",
    projectId: "hatimauth",
    storageBucket: "",
    messagingSenderId: "62394723382",
    appId: "1:62394723382:web:bd5e4bb7a365a05b"
  });

  firebase.auth().onAuthStateChanged((user) => {
    if (user) {
      this.setState({loggedIn: true});
    }else {
      this.setState({loggedIn: false });
    }
  });


renderContent () {
 switch (this.state.loggedIn) {
   case true:
     return (
     <Button onPress{()=> firebase.auth().signOut()}> Log Out
      </Button>
     );
   case false:
     return <LoginForm/>;
   default:
    return <Spinner size='large'/>;
    }
}

render () {
  return (
    <View>
      <Header headerText='Authentication'/>
      {this.renderContent}
    </View>
  )
};

export default App;

预计将正常运行，尤其是通过课程视频正常运行该课程为udemy react-native和redux完整课程

Answer 1

您缺少componentWillMount上的右括号。我建议您下载一个linter，类似于您的IDE的漂亮文件。

componentWillMount () {
    firebase.initializeApp(
      {
    apiKey: "AIzaSyAX09VgJkSzx3d5z8UcyznmhTUNLUgYzMw",
    authDomain: "hatimauth.firebaseapp.com",
    databaseURL: "https://hatimauth.firebaseio.com",
    projectId: "hatimauth",
    storageBucket: "",
    messagingSenderId: "62394723382",
    appId: "1:62394723382:web:bd5e4bb7a365a05b"
  });

  firebase.auth().onAuthStateChanged((user) => {
    if (user) {
      this.setState({loggedIn: true});
    }else {
      this.setState({loggedIn: false });
    }
  });
}

此外，我建议您学习如何使用.env文件并将其置于git忽略状态，以免与世界共享API密钥（共享一个很好的软件包以供浏览）：

https://github.com/luggit/react-native-config

如何修复（无法访问的代码ts.7027）本机反应

1 个答案: