react chat ui

reagir-chat-ui

Uma biblioteca de componentes React para construir UIs de chat.

Patrocinador

Patrocinado por Pusher Chatkit:

Características

• Rolagem automática para baixo

• SUPER fácil de usar

• Agrupamento de vários usuários (experimente na demonstração)

Lembre-se de que este projeto ainda está nos estágios iniciais de desenvolvimento. Se você encontrar um bug ou tiver uma solicitação de recurso, crie um problema e/ou envie um tweet para mim aqui.

Instalação

npm install react-chat-ui --save

Uso Básico

 import { ChatFeed, Message } from 'react-chat-ui'// Seu código stuff...render() {

  return (// Seu JSX...<ChatFeed messages={this.state.messages} // Array: lista de objetos de mensagem isTyping={this.state.is_typing} // Booleano: é o destinatário digitando hasInputField={false} // Booleano: use nossa entrada ou use seu próprio showSenderName // mostra o nome do usuário que enviou a mensagem bubblesCentered={false} //Booleano caso as bolhas estejam centralizadas no feed? // JSON: estilos de bolha personalizados bubbleStyles={{ text: {fontSize: 30 }, chatbubble: {borderRadius: 70,padding: 40 }} }/>// Seu JSX...

  )}

Certifique-se de manter uma lista de objetos de mensagem adequados no estado da sua classe. Assim:

 //...este.estado = {
  messages: [new Message({ id: 1, message: "Eu sou o destinatário! (A pessoa com quem você está falando)",}), // Gray bubblenew Message({ id: 0, message: "I' sou você - a bolha azul!" }), // Bolha azul
  ],
  //...};//...

API

• Feed de bate-papo

• Mensagem

• Bolha de bate-papo

• Grupo bolha

Contribuindo!¡1 ?

Contribuições são sempre bem-vindas e incentivadas. Se você não quiser escrever uma solicitação de recurso sozinho, avise você (seja no Twitter ou criando uma solicitação pull) e eu irei codificar essa merda imediatamente.

PENDÊNCIA

• documentação

• documentação

• documentação

Desenvolvimento

 desenvolvedor de fios