Skip to main content
useAppMessage({ onAppMessage?: Function}) : Object useAppMessage can also set up an optional callback for the app-message event.

Parameters

onAppMessage
Function
Callback for the app-message event. When an app-message is sent, the callback will be called with two arguments:
  • ev (Object): The original event payload sent from daily-js.
  • sendAppMessage (Function): The function reference that was created internally inside useAppMessage. This avoids having to call the hook twice in order to respond to an app-message with an app-message.

Return value

sendAppMessage
Function

Example

import { useAppMessage } from '@daily-co/daily-react';
import { useCallback, useState } from 'react';

export const AppMessageDemo = () => {
  const [messages, setMessages] = useState([]);

  const sendAppMessage = useAppMessage({
    onAppMessage: useCallback((ev) => setMessages((m) => [...m, ev]), []),
  });

  useEffect(() => {
    sendAppMessage({ msg: 'Hi, everyone' }, '*');
  }, [sendAppMessage]);

  return (
    <ul>
      {messages.map((ev) => (
        <li>
          {ev.fromId}: {JSON.stringify(ev.data)}
        </li>
      ))}
    </ul>
  );
};

See also

daily-js methods

Events