Chat Message | Quasar Framework

How to contribute

Options & Helpers

Style & Identity

Layout and Grid

Vue Directives

Quasar Plugins

Vue Composables

Security

Quasar CLI (with Vite)

Quasar CLI (with Webpack)

Icon Genie CLI

App Extensions

Quasar Utils

Chat Message

Quasar supplies a chat component called QChatMessage which is really a chat entry that renders the data given by the props.

TIP

To mix messages with avatar and without avatar in the same thread, use a placeholder avatar image.

Usage

TIP

Using the property sent is intended for the sender of the chat message. The other side is for received messages.

WARNING

Always sanitize values if you do not trust the origin (if the value comes from user input).

1. Introduction

2. QChatMessage API

3. Usage

3.1. The basics

3.2. Customization

3.3. Slots

3.4. Sanitization