A react library to interact with a stomp connection via hooks
npm install react-stomp-hooks> A react library to manage a application wide STOMP connection via SockJS or Websockets.
  
``bash`
npm install --save react-stomp-hooks
See also the supplied example project, and its sourcecode.
`jsx
import React from "react";
import { StompSessionProvider, useSubscription } from "react-stomp-hooks";
const App = () => {
return (
//Initialize Stomp connection, will use SockJS for http(s) and WebSocket for ws(s)
//The Connection can be used by all child components via the hooks or hocs.
//All options supported by @stomp/stompjs can be used here
>
);
};
function SubscribingComponent() {
const [lastMessage, setLastMessage] = useState("No message received yet");
//Subscribe to /topic/test, and use handler for all received messages
//Note that all subscriptions made through the library are automatically removed when their owning component gets unmounted.
//If the STOMP connection itself is lost they are however restored on reconnect.
//You can also supply an array as the first parameter, which will subscribe to all destinations in the array
useSubscription("/topic/test", (message) => setLastMessage(message.body));
return
export function SendingMessages() {
//Get Instance of StompClient
//This is the StompCLient from @stomp/stompjs
//Note: This will be undefined if the client is currently not connected
const stompClient = useStompClient();
const sendMessage = () => {
if (stompClient) {
//Send Message
stompClient.publish({
destination: "/app/echo",
body: "Echo 123",
});
} else {
//Handle error
}
};
return ;
}
``
MIT © Sven Kirschbaum