Vue.js firebase 实例 - 用户 UID 作为数据库引用
Posted
技术标签:
【中文标题】Vue.js firebase 实例 - 用户 UID 作为数据库引用【英文标题】:Vue.js firebase instance - Users UID as database ref 【发布时间】:2020-08-24 05:31:31 【问题描述】:是否可以使以下示例正常工作?我已将一些对象推送到 firebase 实时数据库中,参考是登录用户的 UID。但是,即使我想在我们可以从 firebase.auth.currentUser.uid 获得的引用处查询对象,我也会得到一个 NULL 的错误 uid。有没有办法让这个功能工作?
Vue.js 代码:
import firebase from '.././firebase';
import db from '.././firebase';
export default
name: 'addMatch',
data()
return
tableTennisData: [],
player1Name: '',
player2Name: '',
//Game 1
firstMatchPlayer1Game1: '',
firstMatchPlayer1Game2: '',
firstMatchPlayer1Game3: '',
firstMatchPlayer1Game4: '',
firstMatchPlayer1Game5: '',
,
firebase:
tableTennisData: db.ref(firebase.auth().currentUser.uid).child('tableTennis'), // UID Of Null error!
,
addMatch: function (e)
e.preventDefault();
const obj =
//Game 1
player1Name: this.player1Name,
player2Name: this.player2Name,
firstMatchPlayer1Game1: this.firstMatchPlayer1Game1,
firstMatchPlayer1Game2: this.firstMatchPlayer1Game2,
firstMatchPlayer1Game3: this.firstMatchPlayer1Game3,
firstMatchPlayer1Game4: this.firstMatchPlayer1Game4,
firstMatchPlayer1Game5: this.firstMatchPlayer1Game5,
firebase.auth().onAuthStateChanged(function ()
db.ref(firebase.auth().currentUser.uid).child('tableTennis').push(obj);
);
console.log(obj);
,
,
【问题讨论】:
"I'm getting an error uid of NULL" 您收到的确切错误消息是什么,发生在哪一行? @FrankvanPuffelen 感谢您的回答 :) 通过将 firebase 数据库对象分配给“tableTennisData”数组,我遇到了错误。在特定行有注释。错误消息:“addMatch.vue?c217:231 Uncaught TypeError: Cannot read property 'uid' of null” @FrankvanPuffelen 如何将 Firebase 对象从 Vue 包装到 onAuthStateChange 处理程序中?由于 Vue.js 语法,这很困难...... 【参考方案1】:听起来用户还没有登录。
请注意,当您加载页面时,Firebase 需要一段时间才能恢复用户的身份验证状态。如果您在此之前拨打auth.currentUser
,您将回复null
。
tableTennisData: db.ref(firebase.auth().currentUser.uid).child('tableTennis'),
我看不到您在哪里调用此代码,但您需要将其包装在 onAuthStateChanged
处理程序中,就像在 addMatch
中所做的那样。
【讨论】:
再次感谢您的回复。但是我怎样才能将它包装到 onAuthStateChange 处理程序中呢?以上是关于Vue.js firebase 实例 - 用户 UID 作为数据库引用的主要内容,如果未能解决你的问题,请参考以下文章
如何删除用户点击按钮? - Firebase - Vue.js
Vue.js 和 Firebase:删除了一个测试用户,现在所有路由都无法访问并且组件不呈现
用户在 Vue.js 和 Firebase 中注册后更改导航栏的状态