我目前正在使用react native和firebase开发一个聊天应用程序,我已经创建了两个通道,一个用于常规聊天,一个用于活动。问题是,当我在常规通道中发送消息时,事件通道的消息列表被常规通道的消息列表所取代。如果我在事件通道中发送消息,则我的常规通道消息列表将替换为事件通道的消息列表。您如何使用Firebase分开讨论以避免这种冲突?
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { loadMessages } from '../../../../store/chat/actions'
import { getChatItems } from '../../../../store/chat/selectors'
import MessageListComponent from './Component'
class MessagesListContainer extends Component {
componentDidMount() {
this.props.loadMessages()
}
render() {
const data = getChatItems(this.props.messages).reverse();
console.log(this.data)
return (
<MessageListComponent
data={data} />
)
}
}
const mapStateToProps = state => ({
messages: state.chat.messages,
error: state.chat.loadMessagesError
})
const mapDispatchToProps = {
loadMessages
}
MessagesListContainer.propTypes = {
messages: PropTypes.object,
error: PropTypes.string,
loadMessages: PropTypes.func.isRequired
}
export default connect(mapStateToProps, mapDispatchToProps)(MessagesListContainer)
这是我的action.js,在其中链接我的常规频道:
import * as types from './actionTypes'
import firebaseService from '../../services/firebase'
const FIREBASE_REF_MESSAGES = firebaseService.database().ref('Messages')
const FIREBASE_REF_MESSAGES_LIMIT = 20
export const sendMessage = message => {
return (dispatch) => {
dispatch(chatMessageLoading())
let currentUser = firebaseService.auth().currentUser
let createdAt = new Date().getTime()
let chatMessage = {
text: message,
createdAt: createdAt,
user: {
id: currentUser.uid,
email: currentUser.email
}
}
FIREBASE_REF_MESSAGES.push().set(chatMessage, (error) => {
if (error) {
dispatch(chatMessageError(error.message))
} else {
dispatch(chatMessageSuccess())
}
})
}
}
export const updateMessage = text => {
return (dispatch) => {
dispatch(chatUpdateMessage(text))
}
}
export const loadMessages = () => {
return (dispatch) => {
FIREBASE_REF_MESSAGES.limitToLast(FIREBASE_REF_MESSAGES_LIMIT).on('value', (snapshot) => {
dispatch(loadMessagesSuccess(snapshot.val()))
}, (errorObject) => {
dispatch(loadMessagesError(errorObject.message))
})
}
}
const chatMessageLoading = () => ({
type: types.CHAT_MESSAGE_LOADING
})
const chatMessageSuccess = () => ({
type: types.CHAT_MESSAGE_SUCCESS
})
const chatMessageError = error => ({
type: types.CHAT_MESSAGE_ERROR,
error
})
const chatUpdateMessage = text => ({
type: types.CHAT_MESSAGE_UPDATE,
text
})
const loadMessagesSuccess = messages => ({
type: types.CHAT_LOAD_MESSAGES_SUCCESS,
messages
})
const loadMessagesError = error => ({
type: types.CHAT_LOAD_MESSAGES_ERROR,
error
})
谢谢!