【问题标题】:React-native Firebase database.Ref.on fires only onceReact-native Firebase database.Ref.on 只触发一次
【发布时间】:2019-02-21 20:00:49
【问题描述】:

我正在Android连接的设备(不是模拟器)上开发,并启用了Live Reload。每次我保存文件时,它都会在设备上重新加载我的应用程序 - 这就是我想要的。

我目前正在使用 Firebase 进行身份验证和实时数据库。 为了检索记录的用户数据,我有一个 Redux 操作,它像这样调用 firebase.database()

// AppRedux.js
const reducer = (state = initialState, action) => {
    switch (action.type) {
        case 'setCurrentUser':
            return { ...state, currentUser: action.value }
            break;
        // { ... }
    }
}

const store = createStore(reducer, applyMiddleware(thunkMiddleware))
export { store }

const setCurrentUser = (user) => {
    return {
        type: "setCurrentUser",
        value: user
    }
}

const watchUserData = () => {
    return function(dispatch) {
        const { currentUser } = firebase.auth()

        if (currentUser) {
            console.log(currentUser.uid) // I always have the right uid, so firebase.auth() always works
            const ref = firebase.database().ref('users/' + currentUser.uid)

            ref.on('value', (snapshot) => {
                const user = snapshot.val()
                console.log(user) // I get there onlye once !

                dispatch(setCurrentUser(user))
            }, (error) => {
                console.log(error)
            })
        }
    }
}
export { setCurrentUser, watchUserData }

这就是我所说的这个动作:

// Main.js

// { ... other imports}
import { watchUserData } from '../redux/AppRedux'


const mapStateToProps = (state) => {
    return {
        currentUser: state.currentUser
    }
}
const mapDispatchToProps = (dispatch) => {
    return {
        watchUserData: () => dispatch(watchUserData())
    }
}

class Main extends React.Component {
    constructor(props) {
        super(props)
    }

    componentWillMount() {
        this.props.watchUserData()
    }

    render() {
        const { currentUser } = this.props

        return (
            <View>
                <Text>Hello { currentUser && currentUser.firstname }!</Text>
            </View>
        )
    }
}
export default connect(mapStateToProps, mapDispatchToProps)(Main)

这段代码完美运行 - 但只有一次。当 Live Reload 触发时,它将不再起作用。

请注意,firebase.auth() 仍然有效并给了我正确的 uid,但 firebase.database().ref('users/' + currentUser.uid).on('value') 不会再触发了

我必须npm run android(等于react-native run-android)才能再次触发。直到下一次 Live Reload

请注意,即使我注销并再次登录,它也不起作用。我仍然需要npm run android 才能正常工作。

这是我的 package.json 以防万一

"dependencies": {
    "react": "^16.3.2",
    "react-native": "^0.55.3",
    "react-native-firebase": "^4.3.6",
    "react-native-google-signin": "^1.0.0-rc5",
    "react-navigation": "^2.14.2",
    "react-redux": "^5.0.7",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0"
}

我做错了什么吗?是因为我有一个免费 Firebase 计划,而且我打了太多电话还是什么?

【问题讨论】:

  • 出于好奇,直接更改数据库中的数据会发生什么?监听器会再次触发吗?
  • @JamesPoag 在npm run android 数据按应有的方式更新之后。在 Live Reload 之后,什么也没有发生。
  • 好的,所以你肯定不会打太多电话。我认为在某个地方,RHL 并没有像你想象的那样重新开始。如果我有时间,我可能会撒一些console.logs 来弄清楚热重载时调用了什么以及不调用什么。甚至可能是 Redux 在重放状态时绕过了中间件。
  • @JamesPoag 一个很好的提示是 Hot Reloading 可以完美运行,而 Live Reloading 则不行。

标签: android firebase react-native firebase-realtime-database


【解决方案1】:

我认为它与多次调度有关,请尝试:

dispatch(setCurrentUser(user), { allowMore: true })

你可以在here阅读更多内容

【讨论】:

    【解决方案2】:

    对于任何通过搜索登陆这里的人,这似乎是bug in react-native-firebase

    【讨论】:

    • 是的,我也在 Github 上报告过。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-10-29
    • 1970-01-01
    • 1970-01-01
    • 2018-12-30
    • 2017-01-21
    • 2020-07-23
    • 2021-03-22
    相关资源
    最近更新 更多