Skip to page content

聊天消息

Quasar 提供了一个名为 QChatMessage 的聊天组件,它实际上是一个聊天条目,根据传入的 props 来渲染数据。

TIP

如果需要在同一个聊天线程中混合显示有头像和无头像的消息,可以使用一个占位头像图片。

用法

基础用法

TIP

使用 sent 属性表示这是发送方的消息。不设置该属性则表示接收方的消息。

基础



名称



头像



标签



自定义

尺寸



插槽

安全过滤

WARNING

如果数据来源不可信(例如来自用户输入),请务必对内容进行安全过滤。

无障碍访问
v2.25+

消息文本是普通可读内容,头像图片对辅助技术隐藏。发送与接收仅通过视觉方式区分(对齐方向和颜色),所以请始终提供 name 属性——或等效的文本内容——以便播报消息的作者。*-html 属性会渲染原始 HTML:对其进行消毒处理完全是你的责任(参见上文"消毒处理"部分)。