关于前端:知晓云实时数据库websocket-minapp方法subscribe的使用

38次阅读

共计 995 个字符,预计需要花费 3 分钟才能阅读完成。

就以 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

留神点

数据表的权限 会影响订阅是否有返回,请确认以后用户是否有读写的权限
应用 subscribeunsubscribe时,必须一一对应。如

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')

正文完
 0