[英]Firebase index.js
我无法将数据库导入我的应用程序。
./src/Feed.js 尝试导入错误:“db”未从“./firebase”导出。
import * as firebase from 'firebase';
import 'firebase/firestore';
const firebaseConfig = {
apiKey: "",
authDomain: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: ""
};
const firebaseApp=firebase.initializeApp(firebaseConfig);
const db=firebaseApp.firestore();
const auth=firebase.auth();
export default {db,auth};
我认为这应该有效。
import * as firebase from 'firebase';
import 'firebase/firestore';
const firebaseConfig = {
apiKey: "",
authDomain: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: ""
};
const firebaseApp = firebase.initialiseApp(firebaseConfig);
export const db = firebaseApp.firestore();
export const auth = firebase.auth();
// You can remove the export default.
我要导入数据库的文件:
import React,{useState,useEffect} from 'react'
import './Feed.css'
import CreateIcon from '@mui/icons-material/Create';
import InputOption from './InputOption'
import ImageIcon from '@mui/icons-material/Image';
import SubscriptionsIcon from '@mui/icons-material/Subscriptions';
import EventNoteIcon from '@mui/icons-material/EventNote';
import CalendarViewDayIcon from '@mui/icons-material/CalendarViewDay';
import Post from './Post';
import { db } from"./firebase";
function Feed() {
const[posts,setPosts]=useState([]);
useEffect(()=>{
db.collection('posts').onSnapshot(snapshot=>{
setPosts(snapshot.docs.map(doc=>(
{
id:doc.id,
data:doc.data(),
}
)))
})
},[])
const sendPost=e=>{
e.preventDefault();
}
return (
<div className="feed">
<div className="feed_inputContainer">
<div className="feed_input">
<CreateIcon/>
<form>
<input type="text" placeholder="Start a post" />
<button onClick={sendPost} type="submit ">Send</button>
</form>
</div>
<div className="feed_inputOptions">
<InputOption Icon={ImageIcon} title='Photo' color="#70B5F9"/>
<InputOption Icon={SubscriptionsIcon} title="Video" color="#E7A33E"/>
<InputOption Icon={EventNoteIcon} title="Event" color="#C0CBCD"/>
<InputOption Icon={CalendarViewDayIcon} title="Write article" color="#7FC15E"/>
</div>
</div>
{posts.map(([post])=>{
<Post/>
})}
<Post name="Sonny Shanga" description='This is a test'
message='WOW this worked' />
</div>
)
}
export default Feed
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.