就以Taro为例子,对实时数据库的应用进行示例。
实时效果
安装依赖
npm install @minappjs/weapp
使用
对chat
表的新增数据进行订阅。如下:
import React, {useEffect, useState} from 'react'
import {View, Text, Button} from '@tarojs/components'
import {subscribe, unsubscribe} from '@minappjs/weapp'
import {TABLE} from '../../constants/constants'
function Index() {
const [say, setSay] = useState([])
useEffect(() => {
subscribe(TABLE.chat, 'create', (res) => {
console.log('AAAAAAAAAAA', res)
if(res.event === 'on_create'){
setSay(prev => ([...prev, res.after]))
}
})
}, [])
return(
<View>
{say.map((item, index) => (
<View key={item.id}>
<Text className='content'>{item.content}</Text>
</View>
))}
<Button
onClick={() => {
unsubscribe(TABLE.chat, 'create')
}}
>取消订阅</Button>
</View>
)
}
export default Index
注意点
数据表的权限会影响订阅是否有返回,请确认当前用户是否有读写的权限
使用subscribe
和unsubscribe
时,必须一一对应。如
subscribe(TABLE.chat, 'create', (res) => {
if(res.event === 'on_create'){
}
}, '5')
//对应
unsubscribe(TABLE.chat, 'create', '5')
/************************************/
subscribe(TABLE.chat, 'update', (res) => {
if(res.event === 'on_update'){
}
})
//对应
unsubscribe(TABLE.chat, 'update')
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。