0.0.8-alpha1 • Published 5 years ago
soul-chatbox v0.0.8-alpha1
soul-chatbox
React Chatbox component
Just a component
<Chatbox
messages={[]}
onSend = {/*send button callback*/}
onLeave = {/*leave button callback*/}
userInfo = {{nickname:'<String>',sex:'boy||girl'}}
/>
Message Structure
const message = {
who: 'me' || 'you' || 'system',
sex: 'boy' || 'girl' || 'unknown',
nickname: '<String>',
text: '<String>'
};
Usage
// ./App.jsx
import Chatbox from 'soul-chatbox';
export default () => {
const [messages, setMessages] = useState([]);
const onSend = mes => {
//do something like socket.emit(mes)
setMessages([...messages, mes]);
};
const onLeave = () => alert('leave');
return (
<div className="wrapper">
{/* use wrapper style to wrap background-color */}
<Chatbox
messages={messages}
onSend={onSend}
onLeave={onLeave}
userInfo={{
nickname: 'Dennis',
sex: 'boy'
}}
/>
{/* userInfo 將決定onSend拿到的mes的nickname與sex */}
</div>
);
};
0.0.8-alpha1
5 years ago
0.0.8
5 years ago
0.0.6-beta-v1
5 years ago
0.0.6-beta
5 years ago
0.0.7
5 years ago
0.0.6
5 years ago
0.0.5
5 years ago
0.0.4
5 years ago
0.0.3
5 years ago
0.0.2
5 years ago
0.0.1
5 years ago