a single instance socket-io hooks lib for react components
npm install use-socket.io-hooksa single instance socket-io hooks lib for react components
Since most scene of socket-io are single instance, why not directly provide a react lib based entirely on a single socket instance.
``shell`
$ npm i use-socket.io-hooks
`tsx
import { Provider, useListener, useEmit } from 'use-socket.io-hooks'
const Main = () => {
const push = useEmit('ping')
useListener('ping', (data) => {
alert(data)
})
return
}
const App = () => {
return (
)
}
export default App
`
The Connect hook. not need Provider
`tsx`
const { connect, disconnect } = useConnect(
The monitored data is automatically converted to state.
`tsx`
const { value } = useOnState(
`tsx
import { Provider, useListener, useEmit } from 'use-socket.io-hooks'
const Main = () => {
const push = useEmit('ping')
useMounted(() => {
push('2333')
})
useListener('ping', (data) => {
alert(data)
})
return
Roadmap
- [x] lazy Connect
- [x] add connect hooks params
- [x] state store (get Event linked state)
- [ ] more hooks (use On / Off Any, useEncryptEmit)
- [ ] expose socket context
- [ ] muti nsp (opinion)
- [ ] release 1.0 and OC
Issue
if you use vite: https://github.com/vitejs/vite/issues/4798#issuecomment-925689898
tsx
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'// https://vitejs.dev/config/
export default defineConfig({
resolve: {
alias: {
'xmlhttprequest-ssl':
'./node_modules/engine.io-client/lib/xmlhttprequest.js',
},
},
plugins: [react()],
})
``