Início / coding / Perguntas / 79041591
Accepted
MeltingDog
Asked: 2024-10-01 11:52:09 +0800 CST

Como posso acionar uma função JS externa de dentro de um componente React?

  • 772

Estou criando um aplicativo em React e colocando-o em uma página do meu site.

Tenho um widget/plugin de chat de terceiros no meu site e gostaria que ele fosse ativado quando um botão específico fosse clicado no meu componente React. No vanilla JS, isso geralmente é feito com a seguinte função:

LiveChat.openChatWindow();

No entanto, não consigo descobrir agora como chamar essa função de dentro do meu componente React.

Eu tentei

  const launchChat = () => {
    LiveChat.openChatWindow();
  }
// Other code

  <a class="btn chat-btn" onClick={launchChat}>Chat to us</a>

Mas o aplicativo não compila porque, é claro, LiveChatnão está definido (na minha máquina local).

Também não consigo iniciar o chat detectando um clique de fora do componente, porque, é claro, o botão é criado pelo React, e não no DOM.

$(function(){
  $(".chat-btn").click(function(){
    LiveChat.openChatWindow();
  });
});

Alguém sabe como devo proceder?

javascript

1 respostas

  1. Best Answer

    Você pode conceder o LiveChatescopo windowe no componente React apenas acessá-lo de window.

    Este é o código de exemplo:

    1. Onde você declarou a variável LiveChat
    window.LiveChat = ...
    1. No componente de reação
    const launchChat = () => {
  window.LiveChat.openChatWindow();
}
    • 2

relate perguntas