# #javascript #reactjs #firebase #firebase-realtime-database #jsx
Вопрос:
Я создаю веб-приложение, используя React для проекта. Я использую аутентификацию Firebase и базу данных в реальном времени для хранения своих пользователей. Я хотел бы назначить одного конкретного пользователя администратором и сделать страницу администратора на моей панели навигации видимой только для этого пользователя. Однако у меня возникли проблемы с получением пользователя из базы данных или использованием скрытого атрибута JSX. Любая помощь будет признательна, спасибо.
Я отметил важные разделы с помощью //здесь
Файл Firebase
import firebase from "firebase";
import 'firebase/auth';
import 'firebase/database';
const config = {
...
};
class Firebase {
constructor() {
firebase.initializeApp(config);
firebase.analytics();
this.auth = firebase.auth();
this.db = firebase.database();
}
doCreateUserWithEmailAndPassword = (email, password) =>
this.auth.createUserWithEmailAndPassword(email, password);
doSignInWithEmailAndPassword = (email, password) =>
this.auth.signInWithEmailAndPassword(email, password);
doSignOut = () => this.auth.signOut();
doPasswordReset = email => this.auth.sendPasswordResetEmail(email);
doPasswordUpdate = password =>
this.auth.currentUser.updatePassword(password);
user = uid => this.db.ref(`users/${uid}`);
adminuser = () => this.db.ref(`users/vU6rm45ZTyQFEkX2FgkuqOjauuO2`) //here
users = () => this.db.ref('users');
}
export default Firebase;
Файл навигации
import React from "react";
import {
Nav,
NavLink,
Bars,
NavMenu,
NavBtn,
NavBtnLink
} from './NavBar'
import SignOutButton from '/Users/dogualemdar/Desktop/Coding/kocmun/src/components/SignOut/index.js'
import * as ROUTES from './routes';
import Firebase from "../Firebase";
const Navigation = ({ authUser }) => (
<div>{authUser ? <NavigationAuth /> : <NavigationNonAuth />}</div>
);
const NavigationAuth = () => (
<>
<Nav>
<NavLink to = {ROUTES.HOME}>
<img src = "http://kocmun.mydp.tech/kocmun_icon.png" alt= "Not Found" width = "75" height = "75"/>
</NavLink>
<Bars />
<NavMenu>
<NavLink to = {ROUTES.PROFILE} activeStyle>
Profile
</NavLink>
<NavLink to = {ROUTES.ADMIN} activeStyle hidden = {!Firebase.adminuser} > //here
Admin
</NavLink>
<NavLink to = {ROUTES.PWFORGET} activeStyle>
Reset Password
</NavLink>
</NavMenu>
<NavBtn>
<NavBtnLink to = {ROUTES.HOME}>
<SignOutButton />
</NavBtnLink>
</NavBtn>
</Nav>
</>
);
const NavigationNonAuth = () => (
<>
<Nav>
<NavLink to = {ROUTES.HOME}>
<img src = "http://kocmun.mydp.tech/kocmun_icon.png" alt= "Not Found" width = "75" height = "75"/>
</NavLink>
<Bars />
<NavMenu>
<NavLink to = {ROUTES.ABOUT} activeStyle>
About
</NavLink>
<NavLink to = {ROUTES.ENTRY} activeStyle>
Entry Requirements
</NavLink>
<NavLink to = {ROUTES.CONTACTUS} activeStyle>
Contact Us
</NavLink>
</NavMenu>
<NavBtn>
<NavBtnLink to = {ROUTES.SIGNIN}> Sign In </NavBtnLink>
</NavBtn>
</Nav>
</>
);
export default Navigation;