自訂訊息渲染

使用 renderMessageContent 接管特定訊息的渲染方式。你可以依照 自訂 payload type 分派成不同的 React 元件，並決定是否保留預設 的頭像與泡泡包裝。

Renderer 模式

聊天機器人載入中…

模式

模式	使用時機
with-avatar	客製內容，但保留預設頭像與泡泡
no-avatar	完全客製渲染，不使用 MessageContainer
wrapper	在預設內容之外加入時間戳 / metadata 等包裝
default	回到預設渲染

程式範例

<Chatbot
  renderMessageContent={({ message, renderDefaultContent, MessageContainer }) => {
    if (message.type === "bot") {
      const payload = message.message.payload;
      if (payload?.customType === "order_card") {
        return (
          <MessageContainer>
            <OrderCard payload={payload} />
          </MessageContainer>
        );
      }
    }
    return renderDefaultContent();
  }}
/>