ChatList

List Contacts

When we develop chat applications, we want to keep a list of the people we are messaging.

Here we can easily use the chatlist component.

Kursat

just now

Thank you so much.

1

Emre

just now

Okey. I'll send you.

Example Usage

import { ChatList } from "react-chat-elements"

<ChatList
  className='chat-list'
  dataSource={[
    {
      avatar: 'https://avatars.githubusercontent.com/u/80540635?v=4',
      alt: 'kursat_avatar',
      title: 'Kursat',
      subtitle: "Why don't we go to the No Way Home movie this weekend ?",
      date: new Date(),
      unread: 3,
    }
]} />

Result

Kursat

just now

Why don't we go to the No Way Home movie this weekend ?

3

ChatList Props

prop	default	type	description
id	none	string | number	Chatlist id
className	none	string	optional chat list className
dataSource	[]	array	chat list array
onClick	none	function	chat list item on click (chat(object) returns)
onContextMenu	none	function	chat list item on context menu (chat(object) returns)
onAvatarError	none	function	chat list item on error avatar img
lazyLoadingImage	none	string	lazy loading image path
onClickMute	none	function	mute click function (chat(object) returns)
onClickVideoCall	none	function	video call click function (chat(object) returns)
onDragOver	none	function	ondragover event
onDragEnter	none	function	ondragenter event
onDrop	none	function	ondrop event
onDragLeave	none	function	ondragleave event
onDragComponent	none	function	the component which showing while drag