在 React Native 项目结构中指定 Firebase 内容的位置



正在创建 react 本机应用程序,并且必须在其中使用 Firebase 数据库。

因此,我浏览了Firebase控制台,对于react-native开发,我选择了WEB选项,而不是Android和IOS。

所以,我得到了如下:

<script src="https://www.gstatic.com/firebasejs/5.4.0/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "AIzcSyGByfEez587Lor799jeyJRnFYH0z1yu354",
authDomain: "fir-app-69dcx.firebaseapp.com",
databaseURL: "https://fir-app-69dcx.firebaseio.com",
projectId: "fir-app-69dcx",
storageBucket: "fir-app-69dcx.appspot.com",
messagingSenderId: "5548741593"
};
firebase.initializeApp(config);
</script>

它说:单击"复制",然后将代码段粘贴到应用程序 HTML 中

我正在使用Visual Studio IDE进行开发。

我很困惑,我可以在我的 React 原生项目结构中在哪里添加上面的火碱内容?

谢谢。

从一个漂亮的 tuto 我在这里遵循了这个:

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: 'stuff',
authDomain: 'stuff',
databaseURL: 'stuff',
projectId: 'stuff',
storageBucket: 'stuff',
messagingSenderId: 'stuff'
});
firebase.auth().onAuthStateChanged((user) => {
if (user) {
this.setState({ loggedIn: true });
} else {
this.setState({ loggedIn: false });
}
});
}
renderContent() {
switch (this.state.loggedIn) {
case true:
return (
<View style={{ flexDirection: 'row', paddingTop: 5 }}>
<Button onPress={() => firebase.auth().signOut()}>
Log out
</Button>
</View>
);
case false:
return <LoginForm />;
default:
return (
<View style={{ flexDirection: 'row', paddingTop: 5 }}>
<Spinner />
</View>
);
}
}
render() {
return (
<View>
<Header headerText="Authentification" />
{this.renderContent()}
</View>
);
}
}
export default App;

最新更新