未捕获的类型错误:(0,_firebase.auth)不是函数

2023-12-25

尝试在 React 应用程序中使用 Firebase 身份验证。 我按照 firbase 文档中的说明进行操作。

使用 npm 安装 firebase

添加了 firebase.js 文件:

import * as firebase from 'firebase'

var config = {
  apiKey: "AIzaSyBUORmX2qG7BXFC4hqfKAq0Y6HMAsLTGbw",
  authDomain: "hardy-brooklyn.firebaseapp.com",
  databaseURL: "https://hardy-brooklyn.firebaseio.com",
  projectId: "hardy-brooklyn",
  storageBucket: "hardy-brooklyn.appspot.com",
  messagingSenderId: "392580429077"
};
firebase.initializeApp(config);

const auth = firebase.auth();

export {
  auth,
};

调用我的组件中的身份验证函数之一:

"use strict";
import React, { Component } from "react";
import { auth } from "../../firebase"

export default class Nav extends Component {
  constructor(props) {
    super(props);
    this.state = {
      nav: "hideNav",
      login: "hideLogin",
      email: "",
      password: ""
    };
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);

  }

  handleChange(event) {
    this.setState({email: event.target.value});
  }

  handleSubmit(event) {
    event.preventDefault();
    let email = this.state.email;
    let password = this.state.password;
    auth().signInWithEmailAndPassword(email, password).catch(function(error) {
      // Handle Errors here.
      var errorCode = error.code;
      var errorMessage = error.message;
    });
    auth().onAuthStateChanged(function(user) {
      if (user) {
        // User is signed in.
        var displayName = user.displayName;
        var email = user.email;
        var emailVerified = user.emailVerified;
        var photoURL = user.photoURL;
        var isAnonymous = user.isAnonymous;
        var uid = user.uid;
        var providerData = user.providerData;
        console.log(displayName)
      } else {
        console.log('no user')
      }
    });


  }

  render() {
    return (
      <div>
        <form id="login" style={loginStyles[this.state.login]} onSubmit={this.handleSubmit}>
          ADMIN USE ONLY
          <br/>
          Email:
          <input type="email" name="email" onChange={this.handleChange}/>
          <br/>
          Password:
          <input type="password" name="password"/>
          <br/>
          <button >submit</button>
          <button onClick={this.hideLogin}>hide</button>
        </form>
      </div>
    );
  }
}

我不断收到错误: Uncaught TypeError: (0 , _firebase.auth) is not a function

我用谷歌搜索了这个错误,但没有看到任何结果。

我究竟做错了什么?谢谢!


在 firebase.js 中你已经在调用firebase.auth()并导出对象。你不应该调用导入的auth再次对象,只需访问导入的 auth 对象并调用其上的下一个函数。

ex.
代替auth().signInWithEmailAndPassword try auth.signInWithEmailAndPassword

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

未捕获的类型错误:(0,_firebase.auth)不是函数 的相关文章

  • JW Player - 视频可以在 Chrome 中播放,不能在 Firefox 或 IE 中播放

    See 工作链接 http www 888behindthescenes com test 在主页上我有两个视频 intro video 和 video container 在 chrome 下我没有问题 但在 firefox 和 IE 中
  • 如何获取数组中对象的属性名称?

    这是我的数组 var testeArray name Jovem1 esteira Macaco name Jovem esteira Doido horse Chimbinha 从上面 我想得到一个像这样的数组 var propertyN
  • React 和 Leaflet 结合的好方法

    我正在开发一个将 React 和 Leaflet 结合起来的项目 但我必须说我在语义方面遇到了一些困难 由于大部分内容都是由 Leaflet 直接管理的 我不知道将 Leaflet 映射实例添加为 React 组件中的状态是否有意义 当涉及
  • 无法使用 Node.JS 将 null 值发送到 MySQL 数据库

    我正在尝试发送null使用 Node JS 到我的 MySQL 数据库 con query INSERT INTO Routes routeTrigger VALUES null title test function err result
  • 重置输入控件的边框颜色 (HTML/Javascript)

    有谁知道使用 javascript 修改输入控件后如何重置它的边框颜色 通过突出显示其中包含不正确或无效数据的字段等来进行验证非常有用 例如 改变边框 document getElementById myinput style border
  • React-Spring useTransition 随机排列我的列表项

    我有一个使用 React Spring 过渡呈现的标签列表 这个想法是 您可以添加项目 如果超过 5 个 则会出现 显示更多 按钮 按此按钮可以切换是显示所有标签还是仅显示前五个标签 问题是当我从 显示更多 转变为 显示更少 时 我注意到
  • Node.JS Web 服务器中的安全性

    所以 我正在学习 Node JS 到目前为止我很喜欢它 我已经有几个项目在工作了 我想我可以在其中使用nodejs 不过 我担心安全问题 如果我使用 Node JS http 模块编写自定义 Web 服务器 我是否可能非常容易受到攻击 Ap
  • 更改导航栏悬停时 div 的背景图像

    我正在开发一个项目 我对 Javascript 很陌生 所以我想知道是否有 Jquery 代码或只是一个关于如何使背景图像在导航菜单悬停时更改的过程 例如将鼠标悬停在链接一上会将 div 的背景图像更改为图像 1 将鼠标悬停在链接二上会将
  • JavaScript 将 NULL 转换为 0

    我正在使用 jQuery 来获取元素的高度 但如果该元素不存在 以下代码将返回 NULL height menu li active ul height returns integer or null 这是一种跨浏览器安全的方法 可以使用以
  • 删除 CSS Transitionend 事件侦听器不起作用

    我在尝试删除 css Transitionend 事件侦听器时遇到问题 我可以添加监听器 e addEventListener transitionend function event transitionComplete event pr
  • 如何为 chrome 和 ie favicon(加载指示器)设置动画

    我的 PM 有一个要求 将图标更改为动画加载图像 仅当我将 link href 指向 gif 文件时 它才适用于 Firefox 我做了一些研究 发现 chrome 不支持动画图标 但wiki https en wikipedia org
  • 按位非运算符

    为什么要按位运算 0 打印 1 在二进制中 不是0应该是1 为什么 你实际上很接近 在二进制中 不是0应该是1 是的 当我们谈论一位时 这是绝对正确的 然而 一个int其值为0的实际上是32位全零 将所有 32 个 0 反转为 32 个 1
  • 将回调函数与原型函数一起使用

    在执行回调时 我无法弄清楚如何传递对象方法而不是排序 通用原型 方法 function Client this name hello Client prototype apiCall function method params callb
  • 无法在 Reactjs 中暂停音频

    我关注了其他提出类似问题的帖子 但他们没有提供解决方案 我无法在 React Hook 中暂停音频 这是我的反应钩子 import React useState from react export default App props gt
  • 元标记服务器端渲染

    我在用反应头盔 https github com nfl react helmet对于服务器端渲染我有点迷失 如果我在谷歌控制台中查看元素 我可以看到标题和元描述 但在查看页面源代码时它们不存在 我使用 Node js 后端和 Expres
  • 内联 YouTube 视频在 iOS 上的 cordova 应用程序中不起作用

    我用 cordova 开发了一个移动应用程序 我确实需要能够播放内联 YouTube 视频 我尝试了一段时间来解决它 我设置了属性playsinline to 1在 YouTube iframe API 中 I put
  • 谷歌地图通过骨干javascript返回div标签但不显示

    我已经开始使用地理定位 我可以获得坐标等 我想在地图中显示它 但是当我将地图返回到 div 时 什么也没有显示 现在我查看了 div 地图正在返回 但只是不可见 这是有问题的 div 请注意 这似乎只是一个小地图的链接 a style di
  • 错误:Javascript 上的 [object Object]

    当我在 Firebug 中运行下面的 javascript 时 我不断收到错误 我已经尝试更改多项内容 但它仍然输出错误 我正在使用 api 从 XML 检索信息 然后将其输出到屏幕上 但我不断收到对象错误 有人能看出为什么吗 任何帮助表示
  • 1° 夏令时 Java 和 JS 表现出不同的行为

    假设巴西利亚 GMT 0300 夏令时于 21 10 2012 00 00 00 此时时钟应提前一小时 Java new Date 2012 1900 9 21 0 0 0 Sun Oct 21 01 00 00 BRST 2012 Chr
  • 获取不正确的日期,将时间戳转换为新日期

    我正在尝试将时间戳转换为日期 但得到的日期不正确 我正在开发一个使用 Angular 和 Typescript 的项目 我有这样的时间戳 1451642400 2016年1月1日 和1454320800 2016年2月1日 如果我编码 da

随机推荐