// 功能上就实现了以下:
1、遍历消息
2、发送消息
3、建立聊天
4、关闭聊天
注意:确实用的web sdk,但web sdk在网页上是可以主动实现监听消息的,但React Native如何实现,我就不知道了!
const Realtime = require('../imsdk/leancloud-realtime').Realtime;
const TextMessage = require('../imsdk/leancloud-realtime').TextMessage;
// 在线聊天
let realtime; // 实例化对象
let IMClientObj; // 连接对象
let conObj; // 会话对象
export default class Chat_page extends Component{
constructor(props) {
super(props);
const { state } = this.props.navigation;
//上级列表传值(app内传值)
this.phone = state.params.phone;
this.user_head_img = state.params.user_head_img;
this.doctor_head_img = state.params.doctor_head_img;
this.other_data = state.params.other_data;
this.doctor_id = '';
/* realtime */
realtime = new Realtime({
appId: Constants.appId_leanCloud,
region: 'cn'
});
// 从本地app取doctor_id
DataCurd.get('doctor_id').then((value)=>{
this.doctor_id = String(value);
let _this = this;
let clientId = this.doctor_id;
let who = String(this.phone);
realtime.createIMClient(clientId).then(function(obj) {
IMClientObj = obj;
return obj.createConversation({
members: [who],
name: clientId+'&&'+who,
unique:true
});
}).then(function(conversation) {
conObj = conversation;
// 查询消息
_this.queryMessages(conversation,_this);
}).then(function(message) {
console.log(clientId+'&&'+who, '建立聊天成功!');
}).catch(console.error);
});
/* realtime */
this.state = {
msgContent:'',
dataSourceChat:new ListView.DataSource({rowHasChanged:(r1,r2) => r1!==r2})
};
}
// 查询消息
queryMessages(conversation,_this){
conversation.queryMessages({
limit: 30, // limit 取值范围 1~1000,默认 20
}).then(function(messages) {
console.log(messages);
_this.setState({dataSourceChat:_this.state.dataSourceChat.cloneWithRows(messages)});
}).catch(console.error.bind(console));
}
// 发送消息
letsChat(){
let _this = this;
let msgContent = _this.state.msgContent.trim();
if (msgContent) {
_this.setState({msgContent: ''});
conObj.send(new TextMessage(msgContent)).then(function(){ // promise回调显示消息数目
_this.queryMessages(conObj,_this);
}).catch(console.error.bind(console));
}
}
// 关闭会话
componentWillUnmount(){
IMClientObj.close();
}